Skip to content
体验新版
项目
组织
正在加载...
登录
切换导航
打开侧边栏
Bug 终结者
vue-vben-admin
提交
4f8e1c1b
V
vue-vben-admin
项目概览
Bug 终结者
/
vue-vben-admin
与 Fork 源项目一致
从无法访问的项目Fork
通知
1
Star
1
Fork
0
代码
文件
提交
分支
Tags
贡献者
分支图
Diff
Issue
0
列表
看板
标记
里程碑
合并请求
0
DevOps
流水线
流水线任务
计划
Wiki
0
Wiki
分析
仓库
DevOps
项目成员
Pages
V
vue-vben-admin
项目概览
项目概览
详情
发布
仓库
仓库
文件
提交
分支
标签
贡献者
分支图
比较
Issue
0
Issue
0
列表
看板
标记
里程碑
合并请求
0
合并请求
0
Pages
DevOps
DevOps
流水线
流水线任务
计划
分析
分析
仓库分析
DevOps
Wiki
0
Wiki
成员
成员
收起侧边栏
关闭侧边栏
动态
分支图
创建新Issue
流水线任务
提交
Issue看板
前往新版Gitcode,体验更适合开发者的 AI 搜索 >>
提交
4f8e1c1b
编写于
2月 19, 2021
作者:
V
vben
浏览文件
操作
浏览文件
下载
电子邮件补丁
差异文件
fix(table): fix known errors in editable tables close #267
上级
e250ad56
变更
5
隐藏空白更改
内联
并排
Showing
5 changed file
with
43 addition
and
24 deletion
+43
-24
CHANGELOG.zh_CN.md
CHANGELOG.zh_CN.md
+7
-0
src/components/Table/src/BasicTable.vue
src/components/Table/src/BasicTable.vue
+1
-0
src/components/Table/src/components/editable/EditableCell.vue
...components/Table/src/components/editable/EditableCell.vue
+27
-18
src/design/ant/index.less
src/design/ant/index.less
+2
-2
src/views/demo/page/form/high/PersonTable.vue
src/views/demo/page/form/high/PersonTable.vue
+6
-4
未找到文件。
CHANGELOG.zh_CN.md
浏览文件 @
4f8e1c1b
...
...
@@ -4,9 +4,16 @@
-
新增
`settingButtonPosition`
配置项,用于配置
`设置`
按钮位置
### ⚡ Performance Improvements
-
优化可编辑居中样式及下拉框宽度过短
-
表格新增编辑时
`edit-change`
事件监听
### 🐛 Bug Fixes
-
修复图片预览样式错误
-
修复图标样式问题
-
修复可编辑表格下拉回显问题
## 2.0.0 (2021-02-18)
...
...
src/components/Table/src/BasicTable.vue
浏览文件 @
4f8e1c1b
...
...
@@ -88,6 +88,7 @@
'
edit-end
'
,
'
edit-cancel
'
,
'
edit-row-end
'
,
'
edit-change
'
,
],
setup
(
props
,
{
attrs
,
emit
,
slots
})
{
const
tableElRef
=
ref
<
ComponentRef
>
(
null
);
...
...
src/components/Table/src/components/editable/EditableCell.vue
浏览文件 @
4f8e1c1b
...
...
@@ -29,21 +29,21 @@
<
script
lang=
"ts"
>
import
type
{
CSSProperties
,
PropType
}
from
'
vue
'
;
import
type
{
BasicColumn
}
from
'
../../types/table
'
;
import
type
{
EditRecordRow
}
from
'
./index
'
;
import
{
defineComponent
,
ref
,
unref
,
nextTick
,
computed
,
watchEffect
}
from
'
vue
'
;
import
{
defineComponent
,
ref
,
unref
,
nextTick
,
computed
,
watchEffect
,
toRaw
}
from
'
vue
'
;
import
{
FormOutlined
,
CloseOutlined
,
CheckOutlined
}
from
'
@ant-design/icons-vue
'
;
import
{
CellComponent
}
from
'
./CellComponent
'
;
import
{
useDesign
}
from
'
/@/hooks/web/useDesign
'
;
import
{
isString
,
isBoolean
,
isFunction
,
isNumber
,
isArray
}
from
'
/@/utils/is
'
;
import
{
useTableContext
}
from
'
../../hooks/useTableContext
'
;
import
clickOutside
from
'
/@/directives/clickOutside
'
;
import
{
CellComponent
}
from
'
./CellComponent
'
;
import
{
useTableContext
}
from
'
../../hooks/useTableContext
'
;
import
{
propTypes
}
from
'
/@/utils/propTypes
'
;
import
{
isString
,
isBoolean
,
isFunction
,
isNumber
,
isArray
}
from
'
/@/utils/is
'
;
import
{
createPlaceholderMessage
}
from
'
./helper
'
;
import
type
{
EditRecordRow
}
from
'
./index
'
;
export
default
defineComponent
({
name
:
'
EditableCell
'
,
components
:
{
FormOutlined
,
CloseOutlined
,
CheckOutlined
,
CellComponent
},
...
...
@@ -136,9 +136,11 @@
if
(
!
component
.
includes
(
'
Select
'
))
{
return
value
;
}
const
options
:
LabelValueOptions
=
editComponentProps
?.
options
??
(
unref
(
optionsRef
)
||
[]);
const
option
=
options
.
find
((
item
)
=>
`
${
item
.
value
}
`
===
`
${
value
}
`
);
return
option
?.
label
;
return
option
?.
label
??
value
;
});
const
getWrapperStyle
=
computed
(
...
...
@@ -188,6 +190,11 @@
}
else
if
(
isString
(
e
)
||
isBoolean
(
e
)
||
isNumber
(
e
))
{
currentValueRef
.
value
=
e
;
}
table
.
emit
?.(
'
edit-change
'
,
{
column
:
props
.
column
,
value
:
unref
(
currentValueRef
),
record
:
toRaw
(
props
.
record
),
});
handleSubmiRule
();
}
...
...
@@ -220,13 +227,17 @@
return
true
;
}
async
function
handleSubmit
(
needEmit
=
true
)
{
const
isPass
=
await
handleSubmiRule
();
if
(
!
isPass
)
return
false
;
async
function
handleSubmit
(
needEmit
=
true
,
valid
=
true
)
{
if
(
valid
)
{
const
isPass
=
await
handleSubmiRule
();
if
(
!
isPass
)
return
false
;
}
const
{
column
,
index
}
=
props
;
const
{
key
,
dataIndex
}
=
column
;
const
value
=
unref
(
currentValueRef
);
if
(
!
key
||
!
dataIndex
)
return
;
const
dataKey
=
(
dataIndex
||
key
)
as
string
;
const
record
=
await
table
.
updateTableData
(
index
,
dataKey
,
value
);
...
...
@@ -287,15 +298,15 @@
const
validFns
=
(
props
.
record
?.
validCbs
||
[]).
map
((
fn
)
=>
fn
());
const
res
=
await
Promise
.
all
(
validFns
);
const
pass
=
res
.
every
((
item
)
=>
!!
item
);
if
(
!
pass
)
return
;
const
submitFns
=
props
.
record
?.
submitCbs
||
[];
submitFns
.
forEach
((
fn
)
=>
fn
(
false
));
submitFns
.
forEach
((
fn
)
=>
fn
(
false
,
false
));
table
.
emit
?.(
'
edit-row-end
'
);
return
true
;
}
// isArray(props.record?.submitCbs) && props.record?.submitCbs.forEach((fn) => fn());
};
}
...
...
@@ -328,10 +339,6 @@
@prefix-cls: ~'@{namespace}-editable-cell';
.edit-cell-rule-popover {
// .ant-popover-arrow {
// // border-color: transparent @error-color @error-color transparent !important;
// }
.ant-popover-inner-content {
padding: 4px 8px;
color: @error-color;
...
...
@@ -346,6 +353,10 @@
display: flex;
align-items: center;
justify-content: center;
> .ant-select {
min-width: calc(100% - 50px);
}
}
&__icon {
...
...
@@ -359,8 +370,6 @@
}
&__normal {
padding-right: 48px;
&-icon {
position: absolute;
top: 4px;
...
...
src/design/ant/index.less
浏览文件 @
4f8e1c1b
...
...
@@ -14,8 +14,8 @@
}
body {
.anticon {
display: inline-flex
;
.anticon
:not(.app-iconify)
{
vertical-align: 0.1em
;
}
}
...
...
src/views/demo/page/form/high/PersonTable.vue
浏览文件 @
4f8e1c1b
<
template
>
<div>
<BasicTable
@
register=
"registerTable"
>
<BasicTable
@
register=
"registerTable"
@
edit-change=
"handleEditChange"
>
<template
#action
="
{ record, column }">
<TableAction
:actions=
"createActions(record, column)"
/>
</
template
>
...
...
@@ -29,14 +29,11 @@
title
:
'
工号
'
,
dataIndex
:
'
no
'
,
editRow
:
true
,
// customRender: renderEditableRow({ dataIndex: 'no', placeholder: '请输入工号' }),
},
{
title
:
'
所属部门
'
,
dataIndex
:
'
dept
'
,
editRow
:
true
,
// customRender: renderEditableRow({ dataIndex: 'dept', placeholder: '请输入所属部门' }),
},
];
...
...
@@ -90,6 +87,10 @@
record
.
onEdit
?.(
false
,
true
);
}
function
handleEditChange
(
data
:
Recordable
)
{
console
.
log
(
data
);
}
function
handleAdd
()
{
const
data
=
getDataSource
();
const
addRow
:
EditRecordRow
=
{
...
...
@@ -136,6 +137,7 @@
createActions
,
handleAdd
,
getDataSource
,
handleEditChange
,
};
},
});
...
...
编辑
预览
Markdown
is supported
0%
请重试
或
添加新附件
.
添加附件
取消
You are about to add
0
people
to the discussion. Proceed with caution.
先完成此消息的编辑!
取消
想要评论请
注册
或
登录