fix: 超过高度才显示滚动条
This commit is contained in:
@@ -99,7 +99,7 @@ emit('update:columns-dnd', tableColumnsCheckList);
|
||||
<template #content>
|
||||
<a-checkbox-group
|
||||
v-model:value="state.columnsTitleList"
|
||||
style="width: 100%"
|
||||
style="width: 100%; max-height: 450px; overflow-y: auto;"
|
||||
>
|
||||
<Container orientation="vertical" @drop="fnTableColumnsDrop">
|
||||
<Draggable v-for="c in tableColumns" :key="c.title">
|
||||
|
||||
@@ -1604,7 +1604,7 @@ onMounted(() => {
|
||||
<!-- 新增框或修改框 -->
|
||||
<a-modal
|
||||
width="800px"
|
||||
:body-style="{ maxHeight: '650px', 'overflow-y': 'scroll' }"
|
||||
:body-style="{ maxHeight: '650px', 'overflow-y': 'auto' }"
|
||||
:keyboard="false"
|
||||
:mask-closable="false"
|
||||
:visible="modalState.visibleByAdd"
|
||||
|
||||
@@ -1078,7 +1078,7 @@ onMounted(() => {
|
||||
<a-card
|
||||
size="small"
|
||||
:bordered="false"
|
||||
:body-style="{ maxHeight: '650px', 'overflow-y': 'scroll' }"
|
||||
:body-style="{ maxHeight: '650px', 'overflow-y': 'auto' }"
|
||||
:loading="treeState.selectLoading"
|
||||
>
|
||||
<template #title>
|
||||
@@ -1648,7 +1648,7 @@ onMounted(() => {
|
||||
<!-- 新增框或修改框 -->
|
||||
<a-modal
|
||||
width="800px"
|
||||
:body-style="{ maxHeight: '650px', 'overflow-y': 'scroll' }"
|
||||
:body-style="{ maxHeight: '650px', 'overflow-y': 'auto' }"
|
||||
:keyboard="false"
|
||||
:mask-closable="false"
|
||||
:visible="modalState.visibleByAdd"
|
||||
|
||||
@@ -3,6 +3,7 @@ import { reactive, ref, onMounted } from 'vue';
|
||||
import { PageContainer } from '@ant-design-vue/pro-layout';
|
||||
import { message } from 'ant-design-vue/lib';
|
||||
import useI18n from '@/hooks/useI18n';
|
||||
import TableColumnsDnd from '@/components/TableColumnsDnd/index.vue';
|
||||
import { RESULT_CODE_SUCCESS } from '@/constants/result-constants';
|
||||
import {
|
||||
getParamConfigTopTab,
|
||||
@@ -106,7 +107,10 @@ function fnActiveConfigNode(key: string | number) {
|
||||
title: rule.display,
|
||||
dataIndex: rule.name,
|
||||
align: 'left',
|
||||
width: 5,
|
||||
resizable: true,
|
||||
width: 150,
|
||||
minWidth: 150,
|
||||
maxWidth: 350,
|
||||
});
|
||||
}
|
||||
columns.push({
|
||||
@@ -115,7 +119,7 @@ function fnActiveConfigNode(key: string | number) {
|
||||
key: 'index',
|
||||
align: 'center',
|
||||
fixed: 'right',
|
||||
width: 3,
|
||||
width: 100,
|
||||
});
|
||||
arrayState.columns = columns;
|
||||
|
||||
@@ -276,6 +280,8 @@ type ArrayStateType = {
|
||||
size: SizeType;
|
||||
/**多列嵌套记录字段 */
|
||||
columns: Record<string, any>[];
|
||||
/**表格字段列排序 */
|
||||
columnsDnd: Record<string, any>[];
|
||||
/**多列记录数据 */
|
||||
columnsData: Record<string, any>[];
|
||||
/**多列嵌套展开key */
|
||||
@@ -291,6 +297,7 @@ type ArrayStateType = {
|
||||
let arrayState: ArrayStateType = reactive({
|
||||
size: 'middle',
|
||||
columns: [],
|
||||
columnsDnd: [],
|
||||
columnsData: [],
|
||||
arrayChildExpandKeys: [],
|
||||
data: [],
|
||||
@@ -1276,12 +1283,13 @@ onMounted(() => {
|
||||
<a-table
|
||||
class="table"
|
||||
row-key="index"
|
||||
:columns="treeState.selectNode.method === 'get' ? arrayState.columns.filter((s:any)=>s.key !== 'index') :arrayState.columns"
|
||||
:columns="treeState.selectNode.method === 'get' ? arrayState.columns.filter((s:any)=>s.key !== 'index') : arrayState.columns"
|
||||
:data-source="arrayState.columnsData"
|
||||
:size="arrayState.size"
|
||||
:pagination="false"
|
||||
:bordered="true"
|
||||
:scroll="{ x: arrayState.columns.length * 200, y: 450 }"
|
||||
@resizeColumn="(w:number, col:any) => (col.width = w)"
|
||||
:show-expand-column="false"
|
||||
v-model:expanded-row-keys="arrayState.arrayChildExpandKeys"
|
||||
>
|
||||
@@ -1295,6 +1303,10 @@ onMounted(() => {
|
||||
<template #icon> <PlusOutlined /> </template>
|
||||
{{ t('common.addText') }}
|
||||
</a-button>
|
||||
<TableColumnsDnd
|
||||
:columns="arrayState.columns"
|
||||
v-model:columns-dnd="arrayState.columnsDnd"
|
||||
></TableColumnsDnd>
|
||||
</template>
|
||||
|
||||
<!-- 多列数据渲染 -->
|
||||
@@ -1443,7 +1455,7 @@ onMounted(() => {
|
||||
<!-- 新增框或修改框 -->
|
||||
<a-modal
|
||||
width="800px"
|
||||
:body-style="{ maxHeight: '650px', 'overflow-y': 'scroll' }"
|
||||
:body-style="{ maxHeight: '650px', 'overflow-y': 'auto' }"
|
||||
:keyboard="false"
|
||||
:mask-closable="false"
|
||||
:visible="modalState.visible"
|
||||
|
||||
@@ -1135,7 +1135,7 @@ onMounted(() => {
|
||||
<!-- 新增框或修改框 -->
|
||||
<DraggableModal
|
||||
width="800px"
|
||||
:body-style="{ height: '650px', 'overflow-y': 'scroll' }"
|
||||
:body-style="{ maxHeight: '650px', 'overflow-y': 'auto' }"
|
||||
:keyboard="false"
|
||||
:mask-closable="false"
|
||||
:visible="modalState.visibleByEdit"
|
||||
@@ -1566,7 +1566,7 @@ onMounted(() => {
|
||||
<!-- 批量增加框 -->
|
||||
<DraggableModal
|
||||
width="800px"
|
||||
:body-style="{ height: '650px', 'overflow-y': 'scroll' }"
|
||||
:body-style="{ maxHeight: '650px', 'overflow-y': 'auto' }"
|
||||
:keyboard="false"
|
||||
:mask-closable="false"
|
||||
:visible="modalState.visibleByBatch"
|
||||
|
||||
@@ -528,7 +528,7 @@ onMounted(() => {
|
||||
|
||||
&-html {
|
||||
max-height: 300px;
|
||||
overflow-y: scroll;
|
||||
overflow-y: auto;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -528,7 +528,7 @@ onMounted(() => {
|
||||
|
||||
&-html {
|
||||
max-height: 300px;
|
||||
overflow-y: scroll;
|
||||
overflow-y: auto;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -528,7 +528,7 @@ onMounted(() => {
|
||||
|
||||
&-html {
|
||||
max-height: 300px;
|
||||
overflow-y: scroll;
|
||||
overflow-y: auto;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -528,7 +528,7 @@ onMounted(() => {
|
||||
|
||||
&-html {
|
||||
max-height: 300px;
|
||||
overflow-y: scroll;
|
||||
overflow-y: auto;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
Reference in New Issue
Block a user