diff --git a/examples/api/button.js b/examples/api/button.js index b865f3453..74dfba78e 100644 --- a/examples/api/button.js +++ b/examples/api/button.js @@ -7,6 +7,15 @@ const apis = [ enum: '', defVal: '', list: [ + { + name: 'content', + descKey: 'app.api.button.desc.content', + version: '', + type: 'String', + enum: '', + defVal: '', + list: [] + }, { name: 'type', descKey: 'app.api.button.desc.type', diff --git a/examples/api/select.js b/examples/api/select.js index 04fb9444d..627d57137 100644 --- a/examples/api/select.js +++ b/examples/api/select.js @@ -43,6 +43,15 @@ const apis = [ defVal: 'false', list: [] }, + { + name: 'prefix-icon', + descKey: 'app.api.select.desc.prefixIcon', + version: '', + type: 'String', + enum: '', + defVal: '', + list: [] + }, { name: 'placement', descKey: 'app.api.select.desc.placement', @@ -51,6 +60,15 @@ const apis = [ enum: 'top, bottom', defVal: 'bottom', list: [] + }, + { + name: 'transfer', + descKey: 'app.api.select.desc.transfer', + version: '', + type: 'Boolean', + enum: '', + defVal: 'false', + list: [] } ] }, diff --git a/examples/i18n/lang/en-US.js b/examples/i18n/lang/en-US.js index aa4951dce..5bfa458e4 100644 --- a/examples/i18n/lang/en-US.js +++ b/examples/i18n/lang/en-US.js @@ -224,8 +224,8 @@ module.exports = { vxeInput: 'vxe-input', vxeTextarea: 'vxe-textarea', vxeSelect: 'vxe-select', + vxeOptgroup: 'vxe-optgroup', vxeOption: 'vxe-option', - vxeOptionGroup: 'vxe-option-group', vxeButton: 'vxe-button', vxeTooltip: 'vxe-tooltip', vxeModal: 'vxe-modal', @@ -540,6 +540,7 @@ module.exports = { }, button: { desc: { + content: 'Content (support internationalization)', type: 'Type', size: 'Size', name: 'To identify this item', @@ -619,7 +620,9 @@ module.exports = { placeholder: 'Placeholder for null value empty', clearable: 'Whether to display the clear button on the right when there is a value', disabled: 'Whether to disable', - placement: 'Displays the placement of the drop-down list by default' + prefixIcon: 'Prefix icon', + placement: 'Displays the placement of the drop-down list by default', + transfer: 'Whether to insert the popup container into the body' } }, selectGroup: { diff --git a/examples/i18n/lang/zh-CN.js b/examples/i18n/lang/zh-CN.js index 0a3505131..b9edc79b2 100644 --- a/examples/i18n/lang/zh-CN.js +++ b/examples/i18n/lang/zh-CN.js @@ -223,8 +223,8 @@ module.exports = { vxeInput: 'vxe-input', vxeTextarea: 'vxe-textarea', vxeSelect: 'vxe-select', + vxeOptgroup: 'vxe-optgroup', vxeOption: 'vxe-option', - vxeOptionGroup: 'vxe-option-group', vxeButton: 'vxe-button', vxeTooltip: 'vxe-tooltip', vxeModal: 'vxe-modal', @@ -539,6 +539,7 @@ module.exports = { }, button: { desc: { + content: '内容（支持开启国际化）', type: '类型', size: '尺寸', name: '用来标识这一项', @@ -618,7 +619,9 @@ module.exports = { placeholder: '空值显示的占位符', clearable: '当有值时，是否在右侧显示清除按钮', disabled: '是否禁用', - placement: '默认显示下拉列表的方向' + prefixIcon: '头部图标', + placement: '默认显示下拉列表的方向', + transfer: '是否将弹框容器插入于 body 内' } }, selectGroup: { diff --git a/examples/views/select/Select.vue b/examples/views/select/Select.vue index 207c65b28..56f811c93 100644 --- a/examples/views/select/Select.vue +++ b/examples/views/select/Select.vue @@ -19,7 +19,7 @@

- + @@ -29,15 +29,15 @@ - + - - + + - +

@@ -53,27 +53,27 @@ - + - - + + - - + + - - + + - +

@@ -121,7 +121,7 @@ export default {

- + @@ -131,15 +131,15 @@ export default { - + - - + + - +

@@ -155,27 +155,27 @@ export default { - + - - + + - - + + - - + + - +

`, diff --git a/examples/views/table/grid/Form.vue b/examples/views/table/grid/Form.vue index ea8c91e1b..c73d72d00 100644 --- a/examples/views/table/grid/Form.vue +++ b/examples/views/table/grid/Form.vue @@ -39,10 +39,9 @@ export default { sex: '' }, items: [ - { field: 'name', title: 'app.body.label.name', itemRender: { name: 'input', attrs: { placeholder: '请输入名称' } } }, - { field: 'sex', title: '性别', titlePrefix: { message: '帮助信息！！！', icon: 'fa fa-info-circle' }, itemRender: { name: 'select', options: [] } }, - { itemRender: { name: 'input', attrs: { type: 'submit', value: '查询' } } }, - { itemRender: { name: 'input', attrs: { type: 'reset', value: '重置' } } } + { field: 'name', title: 'app.body.label.name', itemRender: { name: '$input', props: { placeholder: '请输入名称' } } }, + { field: 'sex', title: '性别', titlePrefix: { message: '帮助信息！！！', icon: 'fa fa-info-circle' }, itemRender: { name: '$select', options: [] } }, + { itemRender: { name: '$buttons', children: [{ props: { type: 'submit', content: '查询', status: 'primary' } }, { props: { type: 'reset', content: '重置' } }] } } ] }, tableToolbar: { @@ -85,10 +84,9 @@ export default { sex: '' }, items: [ - { field: 'name', title: 'app.body.label.name', itemRender: { name: 'input', attrs: { placeholder: '请输入名称' } } }, - { field: 'sex', title: '性别', titlePrefix: { message: '帮助信息！！！', icon: 'fa fa-info-circle' }, itemRender: { name: 'select', options: [] } }, - { itemRender: { name: 'input', attrs: { type: 'submit', value: '查询' } } }, - { itemRender: { name: 'input', attrs: { type: 'reset', value: '重置' } } } + { field: 'name', title: 'app.body.label.name', itemRender: { name: '$input', props: { placeholder: '请输入名称' } } }, + { field: 'sex', title: '性别', titlePrefix: { message: '帮助信息！！！', icon: 'fa fa-info-circle' }, itemRender: { name: '$select', options: [] } }, + { itemRender: { name: '$buttons', children: [{ props: { type: 'submit', content: '查询', status: 'primary' } }, { props: { type: 'reset', content: '重置' } }] } } ] }, tableToolbar: { diff --git a/examples/views/table/grid/FullEdit.vue b/examples/views/table/grid/FullEdit.vue index 23fe6a64b..cee352234 100644 --- a/examples/views/table/grid/FullEdit.vue +++ b/examples/views/table/grid/FullEdit.vue @@ -34,9 +34,8 @@

{{ $t('app.body.button.showCode') }}

-      {{ demoCodes[0] }}
-      {{ demoCodes[1] }}
-      {{ demoCodes[2] }}
+      {{ demoCodes[0] }}
+      {{ demoCodes[1] }}
@@ -67,12 +66,12 @@ export default { titleWidth: 100, titleAlign: 'right', items: [ - { field: 'name', title: 'app.body.label.name', span: 8, titlePrefix: { message: 'app.body.valid.rName', icon: 'fa fa-exclamation-circle' }, itemRender: { name: 'input', attrs: { placeholder: '请输入名称' } } }, - { field: 'role', title: '角色', span: 8, itemRender: { name: 'input', attrs: { placeholder: '请输入角色' } } }, - { field: 'nickname', title: '昵称', span: 8, itemRender: { name: 'input', attrs: { placeholder: '请输入昵称' } } }, - { field: 'sex', title: '性别', span: 8, folding: true, titleSuffix: { message: '注意，必填信息！', icon: 'fa fa-info-circle' }, itemRender: { name: 'select', options: [] } }, - { field: 'age', title: '年龄', span: 8, folding: true, itemRender: { name: 'input', attrs: { type: 'number', placeholder: '请输入年龄' } } }, - { span: 24, align: 'center', collapseNode: true, itemRender: { name: 'FormItemButtonGroup' } } + { field: 'name', title: 'app.body.label.name', span: 8, titlePrefix: { message: 'app.body.valid.rName', icon: 'fa fa-exclamation-circle' }, itemRender: { name: '$input', props: { placeholder: '请输入名称' } } }, + { field: 'role', title: '角色', span: 8, itemRender: { name: '$input', props: { placeholder: '请输入角色' } } }, + { field: 'nickname', title: '昵称', span: 8, itemRender: { name: '$input', props: { placeholder: '请输入昵称' } } }, + { field: 'sex', title: '性别', span: 8, folding: true, titleSuffix: { message: '注意，必填信息！', icon: 'fa fa-info-circle' }, itemRender: { name: '$select', options: [] } }, + { field: 'age', title: '年龄', span: 8, folding: true, itemRender: { name: '$input', props: { type: 'number', placeholder: '请输入年龄' } } }, + { span: 24, align: 'center', collapseNode: true, itemRender: { name: '$buttons', children: [{ props: { type: 'submit', content: 'app.body.label.search', status: 'primary' } }, { props: { type: 'reset', content: 'app.body.label.reset' } }] } } ] }, tableProxy: { @@ -119,7 +118,7 @@ export default { }, tableColumn: [ { type: 'checkbox', title: 'ID', width: 120 }, - { field: 'name', title: 'Name', remoteSort: true, editRender: { name: 'input' } }, + { field: 'name', title: 'Name', remoteSort: true, editRender: { name: '$input' } }, { field: 'role', title: 'Role', @@ -131,27 +130,15 @@ export default { { label: '程序员鼓励师', value: '程序员鼓励师' } ], filterMultiple: false, - editRender: { name: 'input' } + editRender: { name: '$input' } }, - { field: 'nickname', title: 'Nickname', editRender: { name: 'input' } }, - { field: 'sex', title: 'Sex', editRender: { name: 'select', options: [] } }, - { field: 'age', title: 'Age', remoteSort: true, editRender: { name: 'input', attrs: { type: 'number' } } }, + { field: 'nickname', title: 'Nickname', editRender: { name: '$input' } }, + { field: 'sex', title: 'Sex', editRender: { name: '$select', options: [] } }, + { field: 'age', title: 'Age', remoteSort: true, editRender: { name: '$input', props: { type: 'number' } } }, { field: 'updateDate', title: 'Update Date', width: 160, visible: false, remoteSort: true, formatter: this.formatDate }, { field: 'createDate', title: 'Create Date', width: 160, visible: false, remoteSort: true, formatter: this.formatDate } ], demoCodes: [ - ` - // 创建一个表单-按钮组渲染器 - VXETable.renderer.add('FormItemButtonGroup', { - // 项显示模板 - renderItem (h, renderOpts, params, context) { - return [ - 查询, - 重置 - ] - } - }) - `, ` { // 处理排序条件 - let queryParams = Object.assign({ + const queryParams = Object.assign({ sort: sort.property, order: sort.order }, form) // 处理筛选条件 - filters.forEach(({ column, property, values }) => { + filters.forEach(({ property, values }) => { queryParams[property] = values.join(',') }) return XEAjax.get(\`https://api.xuliangzhan.com:10443/api/user/page/list/\${page.pageSize}/\${page.currentPage}\`, queryParams) @@ -250,7 +237,7 @@ export default { }, tableColumn: [ { type: 'checkbox', title: 'ID', width: 120 }, - { field: 'name', title: 'Name', remoteSort: true, editRender: { name: 'input' } }, + { field: 'name', title: 'Name', remoteSort: true, editRender: { name: '$input' } }, { field: 'role', title: 'Role', @@ -262,11 +249,11 @@ export default { { label: '程序员鼓励师', value: '程序员鼓励师' } ], filterMultiple: false, - editRender: { name: 'input' } + editRender: { name: '$input' } }, - { field: 'nickname', title: 'Nickname', editRender: { name: 'input' } }, - { field: 'sex', title: 'Sex', editRender: { name: 'select', options: [] } }, - { field: 'age', title: 'Age', remoteSort: true, editRender: { name: 'input', attrs: { type: 'number' } } }, + { field: 'nickname', title: 'Nickname', editRender: { name: '$input' } }, + { field: 'sex', title: 'Sex', editRender: { name: '$select', options: [] } }, + { field: 'age', title: 'Age', remoteSort: true, editRender: { name: '$input', props: { type: 'number' } } }, { field: 'updateDate', title: 'Update Date', width: 160, visible: false, remoteSort: true, formatter: this.formatDate }, { field: 'createDate', title: 'Create Date', width: 160, visible: false, remoteSort: true, formatter: this.formatDate } ] diff --git a/examples/views/table/renderer/API.vue b/examples/views/table/renderer/API.vue index f8df131a2..3e7ecb657 100644 --- a/examples/views/table/renderer/API.vue +++ b/examples/views/table/renderer/API.vue @@ -1,19 +1,17 @@ @@ -30,6 +44,38 @@ import hljs from 'highlight.js' export default { data () { return { + nativeRenderList: [ + { + name: 'input', + desc: '原生-输入框' + }, + { + name: 'textarea', + desc: '原生-文本域' + }, + { + name: 'select', + desc: '原生-下拉框' + } + ], + xRenderList: [ + { + name: '$button', + desc: '模块-按钮' + }, + { + name: '$buttons', + desc: '模块-按钮列表' + }, + { + name: '$input', + desc: '模块-输入框' + }, + { + name: '$select', + desc: '模块-下拉框' + } + ], tableData: [ { name: 'add(name, options)', diff --git a/examples/views/table/renderer/Edit.vue b/examples/views/table/renderer/Edit.vue index 9f28d4e72..fb21b3e5e 100644 --- a/examples/views/table/renderer/Edit.vue +++ b/examples/views/table/renderer/Edit.vue @@ -2,7 +2,6 @@

可编辑渲染器 ，查看 示例的源码
- 默认支持原生的：input、textarea、select
配置参数：
autofocus 自动聚焦的类名
renderHeader (h, renderOpts, params) 表头
diff --git a/examples/views/table/renderer/Filter.vue b/examples/views/table/renderer/Filter.vue index 594aed414..d3b359524 100644 --- a/examples/views/table/renderer/Filter.vue +++ b/examples/views/table/renderer/Filter.vue @@ -2,7 +2,6 @@

筛选渲染器 ，查看 示例的源码
- 默认支持原生的：input、textarea、select
配置参数：
className 自定义容器的 className
isFooter 是否显示底部按钮
diff --git a/examples/views/table/renderer/Form.vue b/examples/views/table/renderer/Form.vue index 60bf45c86..07076ba26 100644 --- a/examples/views/table/renderer/Form.vue +++ b/examples/views/table/renderer/Form.vue @@ -1,7 +1,7 @@