From 0210ce03def7362405c88ae1b45d612b9aad151f Mon Sep 17 00:00:00 2001
From: gimmyhehe <975402925@qq.com>
Date: Thu, 28 Dec 2023 09:35:38 +0800
Subject: [PATCH] docs(form): [form] form docs demo optimize (#1225)
---
.../app/form/form-validation-composition-api.vue | 2 +-
.../pc/app/form/slot-label-composition-api.vue | 2 +-
.../app/form/validate-debounce-composition-api.vue | 6 +++---
.../sites/demos/pc/app/form/validate-debounce.vue | 6 +++---
examples/sites/demos/pc/app/form/webdoc/form.js | 14 +++++++-------
packages/vue/src/button/src/index.ts | 2 +-
6 files changed, 16 insertions(+), 16 deletions(-)
diff --git a/examples/sites/demos/pc/app/form/form-validation-composition-api.vue b/examples/sites/demos/pc/app/form/form-validation-composition-api.vue
index ba5fc78a3..080e1b019 100644
--- a/examples/sites/demos/pc/app/form/form-validation-composition-api.vue
+++ b/examples/sites/demos/pc/app/form/form-validation-composition-api.vue
@@ -54,7 +54,7 @@ import { iconWarning } from '@opentiny/vue-icon'
const ruleFormRef = ref()
function handleClick() {
- Modal.message({ message: 'click' })
+ Modal.message({ message: 'click', status: 'info' })
}
const validateIcon = ref(iconWarning())
const validType = ref('promise')
diff --git a/examples/sites/demos/pc/app/form/slot-label-composition-api.vue b/examples/sites/demos/pc/app/form/slot-label-composition-api.vue
index ce901d21a..0c2fbab78 100644
--- a/examples/sites/demos/pc/app/form/slot-label-composition-api.vue
+++ b/examples/sites/demos/pc/app/form/slot-label-composition-api.vue
@@ -37,7 +37,7 @@ import {
} from '@opentiny/vue'
function handleClick() {
- Modal.message({ message: 'click' })
+ Modal.message({ message: 'click', status: 'info' })
}
const options = ref([
diff --git a/examples/sites/demos/pc/app/form/validate-debounce-composition-api.vue b/examples/sites/demos/pc/app/form/validate-debounce-composition-api.vue
index 78e7c0b24..6fe0d5f70 100644
--- a/examples/sites/demos/pc/app/form/validate-debounce-composition-api.vue
+++ b/examples/sites/demos/pc/app/form/validate-debounce-composition-api.vue
@@ -42,7 +42,7 @@ function clearFormValid() {
function handleSubmit() {
ruleFormRef.value.validate((valid) => {
if (valid) {
- Modal.message('提交成功')
+ Modal.message({ message: '提交成功', status: 'info' })
}
})
}
@@ -55,10 +55,10 @@ function validateUser(rule, value, callback) {
new Promise((resolve, reject) => {
setTimeout(() => {
if (value && value.length > 30) {
- Modal.message('校验成功')
+ Modal.message({ message: '校验成功', status: 'info' })
resolve()
} else {
- Modal.message('校验失败')
+ Modal.message({ message: '校验失败', status: 'info' })
reject(new Error('The length must be greater than 30 characters.'))
}
}, 300)
diff --git a/examples/sites/demos/pc/app/form/validate-debounce.vue b/examples/sites/demos/pc/app/form/validate-debounce.vue
index f0e3e68f3..8bc231d7c 100644
--- a/examples/sites/demos/pc/app/form/validate-debounce.vue
+++ b/examples/sites/demos/pc/app/form/validate-debounce.vue
@@ -44,7 +44,7 @@ export default {
handleSubmit() {
this.$refs.ruleFormRef.validate((valid) => {
if (valid) {
- Modal.message('提交成功')
+ Modal.message({ message: '提交成功', status: 'info' })
}
})
},
@@ -56,10 +56,10 @@ export default {
new Promise((resolve, reject) => {
setTimeout(() => {
if (value && value.length > 30) {
- Modal.message('校验成功')
+ Modal.message({ message: '校验成功', status: 'info' })
resolve()
} else {
- Modal.message('校验失败')
+ Modal.message({ message: '校验失败', status: 'info' })
reject(new Error('The length must be greater than 30 characters.'))
}
}, 300)
diff --git a/examples/sites/demos/pc/app/form/webdoc/form.js b/examples/sites/demos/pc/app/form/webdoc/form.js
index 9532a70ae..3785de396 100644
--- a/examples/sites/demos/pc/app/form/webdoc/form.js
+++ b/examples/sites/demos/pc/app/form/webdoc/form.js
@@ -214,7 +214,7 @@ export default {
},
{
demoId: 'popper-options',
- name: { 'zh-CN': '错误提示配置', 'en-US': 'Error tip options' },
+ name: { 'zh-CN': '错误提示', 'en-US': 'Error tip options' },
desc: {
'zh-CN':
'通过 popper-options 设置tip类型错误提示，例如：当表单父元素是滚动元素，切页面滚动后，提示会错位，将 bubbling 属性设置为 true可解决此问题。
',
@@ -227,7 +227,7 @@ export default {
demoId: 'events',
name: { 'zh-CN': '表单事件', 'en-US': 'Form events' },
desc: {
- 'zh-CN': '任一表单项被校验后触发 validate事件
',
+ 'zh-CN': '任一表单项被校验后触发 validate事件。
',
'en-US': 'The validate event is triggered after any form item is verified.'
},
codeFiles: ['events.vue']
@@ -285,7 +285,7 @@ export default {
type: 'boolean',
'defaultValue': '--',
desc: {
- 'zh-CN': '当 validate-type 设置为text时，是否以行内形式展示校验信息(推荐使用 message-type 设置)',
+ 'zh-CN': '当 validate-type 设置为 text 时，是否以行内形式展示校验信息(推荐使用 message-type 设置)',
'en-US':
' Whether to display the verification information inline form when validate-type is set to text,(It is recommended to use message-type setting)'
},
@@ -297,7 +297,7 @@ export default {
'defaultValue': '--',
desc: {
'zh-CN':
- '当 validate-type 设置为text时，配置文本类型错误类型，可配置行内或者块级，不设置则为 absolute 定位',
+ '当 validate-type 设置为 text 时，配置文本类型错误类型，可配置行内或者块级，不设置则为 absolute 定位',
'en-US':
'Configure the text type error type, which can be configured at the inline or block level when validate-type is set to text. The default is absolute positioning'
},
@@ -308,7 +308,7 @@ export default {
type: 'boolean',
defaultValue: 'false',
desc: {
- 'zh-CN': "当出现必填星号时，标签文本是否对齐，当 label-position 为 'right'时有效",
+ 'zh-CN': "当出现必填星号时，标签文本是否对齐，当 label-position 为 'right' 时有效",
'en-US': 'When a mandatory asterisk appears, is it aligned with the text'
},
demoId: 'label-align'
@@ -456,7 +456,7 @@ export default {
'defaultValue': '--',
desc: {
'zh-CN':
- '移除表单项的校验结果，可传入待移除的表单项的prop，或者 prop 组成的数组，如不传则移除整个表单的校验结果',
+ '移除表单项的校验结果，可传入待移除的表单项的 prop ，或者 prop 组成的数组，如不传则移除整个表单的校验结果',
'en-US':
'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.'
},
@@ -492,7 +492,7 @@ export default {
'defaultValue': '--',
desc: {
'zh-CN':
- '对部分表单字段进行校验的方法, 第一个参数为单个prop或者prop数组，第二个参数是回调函数，每个表单项检验完后会依次调用该回调',
+ '对部分表单字段进行校验的方法, 第一个参数为单个 prop 或者 prop 数组，第二个参数是回调函数，每个表单项检验完后会依次调用该回调',
'en-US':
'A method for verifying some form fields. The first parameter is a single prop or a prop array, and the second parameter is a callback function. After each form item is verified, the callback will be called in sequence'
},
diff --git a/packages/vue/src/button/src/index.ts b/packages/vue/src/button/src/index.ts
index 2c74bd21f..27d538f3c 100644
--- a/packages/vue/src/button/src/index.ts
+++ b/packages/vue/src/button/src/index.ts
@@ -39,7 +39,7 @@ export const buttonProps = {
type: String,
default: '',
validator(val: string) {
- return ['large', 'medium', 'small', 'mini'].includes(val)
+ return ['large', 'medium', 'small', 'mini', ''].includes(val)
}
},
round: Boolean,