Browse Source

fix(table): component shown in `fullscreen` mode

修复表格在全屏模式下编辑组件弹出层的显示问题
pull/972/head
无木 5 years ago
parent
commit
a07ab6d7aa
  1. 1
      CHANGELOG.zh_CN.md
  2. 13
      src/components/Table/src/components/TableAction.vue
  3. 1
      src/components/Table/src/components/editable/EditableCell.vue
  4. 2
      src/views/demo/table/EditRowTable.vue

1
CHANGELOG.zh_CN.md

@ -4,6 +4,7 @@
- **BasicTable** 修复可编辑单元格不支持`ellipsis`配置的问题
- **ImgRotateDragVerify** 修复组件`resume`方法无法调用的问题
- **TableAction** 修复 stopButtonPropagation 属性某些情况下不起作用的问题
- **BasicTable** 修复全屏模式下看不到子组件弹出层(popconfirm 以及 select、treeSelect 等编辑组件)的问题
- **Dark Theme** 黑暗主题下的配色问题修正
- 修复`Tree`组件被选中节点的背景颜色
- 修复`Alert`组件的颜色配置

13
src/components/Table/src/components/TableAction.vue

@ -35,7 +35,7 @@
</div>
</template>
<script lang="ts">
import { defineComponent, PropType, computed, toRaw } from 'vue';
import { defineComponent, PropType, computed, toRaw, unref } from 'vue';
import { MoreOutlined } from '@ant-design/icons-vue';
import { Divider, Tooltip, TooltipProps } from 'ant-design-vue';
import Icon from '/@/components/Icon/index';
@ -95,6 +95,7 @@
.map((action) => {
const { popConfirm } = action;
return {
getPopupContainer: () => unref(table?.wrapRef.value) ?? document.body,
type: 'link',
size: 'small',
...action,
@ -131,11 +132,11 @@
});
function getTooltip(data: string | TooltipProps): TooltipProps {
if (isString(data)) {
return { title: data, placement: 'bottom' };
} else {
return Object.assign({ placement: 'bottom' }, data);
}
return {
getPopupContainer: () => unref(table?.wrapRef.value) ?? document.body,
placement: 'bottom',
...(isString(data) ? { title: data } : data),
};
}
function onCellClick(e: MouseEvent) {

1
src/components/Table/src/components/editable/EditableCell.vue

@ -113,6 +113,7 @@
const value = isCheckValue ? (isNumber(val) && isBoolean(val) ? val : !!val) : val;
return {
getPopupContainer: () => unref(table?.wrapRef.value) ?? document.body,
placeholder: createPlaceholderMessage(unref(getComponent)),
...apiSelectProps,
...omit(compProps, 'onChange'),

2
src/views/demo/table/EditRowTable.vue

@ -171,6 +171,8 @@
api: demoListApi,
columns: columns,
showIndexColumn: false,
showTableSetting: true,
tableSetting: { fullScreen: true },
actionColumn: {
width: 160,
title: 'Action',

Loading…
Cancel
Save