refactor(表格组件): 行高调整&排序圆角

This commit is contained in:
baiqi 2024-05-11 19:48:49 +08:00 committed by Craftsman
parent af684b2b8e
commit 65f04379dc
14 changed files with 89 additions and 95 deletions

View File

@ -417,7 +417,7 @@
.arco-checkbox-icon-check { .arco-checkbox-icon-check {
@apply text-white; @apply text-white;
background-color: rgb(var(--primary-5)); background-color: rgb(var(--primary-6));
} }
} }
.arco-checkbox { .arco-checkbox {

View File

@ -608,6 +608,7 @@
top: 24px; top: 24px;
right: -12px; right: -12px;
z-index: 101;
border: 1px solid #ffffff; border: 1px solid #ffffff;
background: linear-gradient(90deg, rgb(var(--primary-9)) 3.36%, #ffffff 100%); background: linear-gradient(90deg, rgb(var(--primary-9)) 3.36%, #ffffff 100%);
box-shadow: 0 0 7px rgb(15 0 78 / 9%); box-shadow: 0 0 7px rgb(15 0 78 / 9%);

View File

@ -80,11 +80,15 @@
:title="item.slotName" :title="item.slotName"
> >
<template #title> <template #title>
<div :class="{ 'flex w-full flex-row flex-nowrap items-center gap-[4px]': !item.align }"> <div
:class="{
'flex w-full flex-row flex-nowrap items-center gap-[4px]': !item.align,
}"
>
<slot :name="item.titleSlotName" :column-config="item"> <slot :name="item.titleSlotName" :column-config="item">
<div v-if="item.title" class="title-name pl-1 text-[var(--color-text-3)]">{{ <div v-if="item.title" class="title-name pl-1 text-[var(--color-text-3)]">
t(item.title as string) {{ t(item.title as string) }}
}}</div> </div>
</slot> </slot>
<columnSelectorIcon <columnSelectorIcon
v-if=" v-if="
@ -662,6 +666,13 @@
color: rgb(var(--primary-7)); color: rgb(var(--primary-7));
opacity: 0; opacity: 0;
} }
:deep(.arco-table-cell) {
padding: 8px 16px;
}
:deep(.arco-table-td) {
line-height: normal;
height: 48px;
}
:deep(.arco-table-cell-align-left) { :deep(.arco-table-cell-align-left) {
.arco-table-td-content { .arco-table-td-content {
@apply flex items-center; @apply flex items-center;
@ -803,11 +814,13 @@
@apply bg-white; @apply bg-white;
} }
:deep(.arco-table-cell-with-sorter) { :deep(.arco-table-cell-with-sorter) {
@apply !p-0;
margin: 8px 16px;
&:hover { &:hover {
@apply bg-white; @apply bg-white;
} }
.arco-table-sorter { .arco-table-sorter {
padding: 3px 4px 3px 0;
.arco-table-sorter-icon { .arco-table-sorter-icon {
&::before { &::before {
content: ''; content: '';
@ -840,16 +853,18 @@
} }
:deep(.arco-table-col-sorted) .arco-table-cell-with-sorter { :deep(.arco-table-col-sorted) .arco-table-cell-with-sorter {
width: fit-content; width: fit-content;
border-radius: var(--border-radius-small);
background: rgb(var(--primary-1)) content-box; background: rgb(var(--primary-1)) content-box;
.arco-table-th-title .title-name { .arco-table-th-title {
color: rgb(var(--primary-5)); .title-name {
color: rgb(var(--primary-5));
}
} }
} }
:deep(.header-cell-filter) { :deep(.header-cell-filter) {
.arco-table-cell-with-filter { .arco-table-cell-with-filter {
float: left; float: left;
.arco-table-th-title { .arco-table-th-title {
border-radius: 4px;
background: rgb(var(--primary-1)) content-box; background: rgb(var(--primary-1)) content-box;
.filter-icon { .filter-icon {
color: rgb(var(--primary-5)) !important; color: rgb(var(--primary-5)) !important;

View File

@ -1,6 +1,6 @@
<template> <template>
<div :class="['p-[0_16px_8px_16px]', props.class]"> <div :class="['p-[0_16px_8px_16px]', props.class]">
<div class="mb-[8px] flex items-center justify-end"> <div class="mb-[16px] flex items-center justify-end">
<div class="flex items-center gap-[8px]"> <div class="flex items-center gap-[8px]">
<a-input-search <a-input-search
v-model:model-value="keyword" v-model:model-value="keyword"
@ -43,7 +43,7 @@
<template #content> <template #content>
<div class="arco-table-filters-content"> <div class="arco-table-filters-content">
<div class="ml-[6px] flex items-center justify-start px-[6px] py-[2px]"> <div class="ml-[6px] flex items-center justify-start px-[6px] py-[2px]">
<a-checkbox-group v-model:model-value="methodFilters" direction="vertical" size="small"> <a-checkbox-group v-model:model-value="methodFilters" direction="vertical">
<a-checkbox v-for="key of RequestMethods" :key="key" :value="key"> <a-checkbox v-for="key of RequestMethods" :key="key" :value="key">
<apiMethodName :method="key" /> <apiMethodName :method="key" />
</a-checkbox> </a-checkbox>
@ -74,7 +74,7 @@
<template #content> <template #content>
<div class="arco-table-filters-content"> <div class="arco-table-filters-content">
<div class="ml-[6px] flex items-center justify-start px-[6px] py-[2px]"> <div class="ml-[6px] flex items-center justify-start px-[6px] py-[2px]">
<a-checkbox-group v-model:model-value="statusFilters" direction="vertical" size="small"> <a-checkbox-group v-model:model-value="statusFilters" direction="vertical">
<a-checkbox v-for="val of Object.values(RequestDefinitionStatus)" :key="val" :value="val"> <a-checkbox v-for="val of Object.values(RequestDefinitionStatus)" :key="val" :value="val">
<apiStatus :status="val" /> <apiStatus :status="val" />
</a-checkbox> </a-checkbox>
@ -104,13 +104,13 @@
@change="() => handleMethodChange(record)" @change="() => handleMethodChange(record)"
> >
<template #label> <template #label>
<apiMethodName :method="record.method" tag-size="small" is-tag /> <apiMethodName :method="record.method" is-tag />
</template> </template>
<a-option v-for="item of Object.values(RequestMethods)" :key="item" :value="item"> <a-option v-for="item of Object.values(RequestMethods)" :key="item" :value="item">
<apiMethodName :method="item" tag-size="small" is-tag /> <apiMethodName :method="item" is-tag />
</a-option> </a-option>
</a-select> </a-select>
<apiMethodName v-else :method="record.method" tag-size="small" is-tag /> <apiMethodName v-else :method="record.method" is-tag />
</template> </template>
<template #status="{ record }"> <template #status="{ record }">
<a-select <a-select
@ -121,13 +121,13 @@
@change="() => handleStatusChange(record)" @change="() => handleStatusChange(record)"
> >
<template #label> <template #label>
<apiStatus :status="record.status" size="small" /> <apiStatus :status="record.status" />
</template> </template>
<a-option v-for="item of Object.values(RequestDefinitionStatus)" :key="item" :value="item"> <a-option v-for="item of Object.values(RequestDefinitionStatus)" :key="item" :value="item">
<apiStatus :status="item" size="small" /> <apiStatus :status="item" />
</a-option> </a-option>
</a-select> </a-select>
<apiStatus v-else :status="record.status" size="small" /> <apiStatus v-else :status="record.status" />
</template> </template>
<template #createUserFilter="{ columnConfig }"> <template #createUserFilter="{ columnConfig }">
<TableFilter <TableFilter
@ -517,7 +517,7 @@
]), ]),
showSelectAll: !props.readOnly, showSelectAll: !props.readOnly,
draggable: hasAnyPermission(['PROJECT_API_DEFINITION:READ+UPDATE']) ? { type: 'handle', width: 32 } : undefined, draggable: hasAnyPermission(['PROJECT_API_DEFINITION:READ+UPDATE']) ? { type: 'handle', width: 32 } : undefined,
heightUsed: 256, heightUsed: 272,
paginationSize: 'mini', paginationSize: 'mini',
showSubdirectory: true, showSubdirectory: true,
}, },
@ -1012,5 +1012,4 @@
} }
} }
} }
.ms-table--special-small();
</style> </style>

View File

@ -1,6 +1,6 @@
<template> <template>
<div class="overflow-hidden p-[8px_22px]"> <div class="overflow-hidden p-[16px_22px]">
<div :class="['mb-[8px]', 'flex', 'items-center', props.isApi ? 'justify-between' : 'justify-end']"> <div :class="['mb-[16px]', 'flex', 'items-center', props.isApi ? 'justify-between' : 'justify-end']">
<a-button <a-button
v-show="props.isApi" v-show="props.isApi"
v-permission="['PROJECT_API_DEFINITION_CASE:READ+ADD']" v-permission="['PROJECT_API_DEFINITION_CASE:READ+ADD']"
@ -57,7 +57,6 @@
v-model:model-value="record.priority" v-model:model-value="record.priority"
:placeholder="t('common.pleaseSelect')" :placeholder="t('common.pleaseSelect')"
class="param-input w-full" class="param-input w-full"
size="mini"
@change="() => handleCaseLevelChange(record)" @change="() => handleCaseLevelChange(record)"
> >
<template #label> <template #label>
@ -102,17 +101,16 @@
v-model:model-value="record.status" v-model:model-value="record.status"
:placeholder="t('common.pleaseSelect')" :placeholder="t('common.pleaseSelect')"
class="param-input w-full" class="param-input w-full"
size="mini"
@change="() => handleStatusChange(record)" @change="() => handleStatusChange(record)"
> >
<template #label> <template #label>
<apiStatus :status="record.status" size="small" /> <apiStatus :status="record.status" />
</template> </template>
<a-option v-for="item of Object.values(RequestCaseStatus)" :key="item" :value="item"> <a-option v-for="item of Object.values(RequestCaseStatus)" :key="item" :value="item">
<apiStatus :status="item" size="small" /> <apiStatus :status="item" />
</a-option> </a-option>
</a-select> </a-select>
<apiStatus v-else :status="record.status" size="small" /> <apiStatus v-else :status="record.status" />
</template> </template>
<template #statusFilter="{ columnConfig }"> <template #statusFilter="{ columnConfig }">
<a-trigger <a-trigger
@ -605,7 +603,7 @@
draggable: hasAnyPermission(['PROJECT_API_DEFINITION_CASE:READ+UPDATE']) draggable: hasAnyPermission(['PROJECT_API_DEFINITION_CASE:READ+UPDATE'])
? { type: 'handle', width: 32 } ? { type: 'handle', width: 32 }
: undefined, : undefined,
heightUsed: 256, heightUsed: 282,
showSubdirectory: true, showSubdirectory: true,
paginationSize: 'mini', paginationSize: 'mini',
}); });
@ -1045,5 +1043,4 @@
} }
} }
} }
.ms-table--special-small();
</style> </style>

View File

@ -89,7 +89,7 @@
</a-form-item> </a-form-item>
</div> --> </div> -->
<div <div
v-if="matchRules.length > 1 && !props.disabled" v-if="matchRules.length > 1 && !props.disabled && idx !== matchRules.length - 1"
class="mt-[8px] flex h-full cursor-pointer items-start justify-center text-[var(--color-text-4)]" class="mt-[8px] flex h-full cursor-pointer items-start justify-center text-[var(--color-text-4)]"
@click="handleDeleteItem(idx)" @click="handleDeleteItem(idx)"
> >

View File

@ -1,6 +1,6 @@
<template> <template>
<div :class="['p-[8px_22px]', props.class]"> <div :class="['p-[16px_22px]', props.class]">
<div :class="['mb-[8px]', 'flex', 'items-center', props.isApi ? 'justify-between' : 'justify-end']"> <div :class="['mb-[16px]', 'flex', 'items-center', props.isApi ? 'justify-between' : 'justify-end']">
<a-button <a-button
v-show="props.isApi" v-show="props.isApi"
v-permission="['PROJECT_API_DEFINITION_MOCK:READ+ADD']" v-permission="['PROJECT_API_DEFINITION_MOCK:READ+ADD']"
@ -44,7 +44,6 @@
<template #enable="{ record }"> <template #enable="{ record }">
<a-switch <a-switch
v-model="record.enable" v-model="record.enable"
size="small"
type="line" type="line"
:before-change="() => handleBeforeEnableChange(record)" :before-change="() => handleBeforeEnableChange(record)"
></a-switch> ></a-switch>

View File

@ -1,6 +1,6 @@
<template> <template>
<div :class="['p-[8px_16px]', props.class]"> <div :class="['p-[16px]', props.class]">
<div class="mb-[8px] flex items-center justify-between"> <div class="mb-[16px] flex items-center justify-between">
<div class="flex items-center"> </div> <div class="flex items-center"> </div>
<div class="items-right flex gap-[8px]"> <div class="items-right flex gap-[8px]">
<a-input-search <a-input-search
@ -44,7 +44,7 @@
<template #content> <template #content>
<div class="arco-table-filters-content"> <div class="arco-table-filters-content">
<div class="ml-[6px] flex items-center justify-start px-[6px] py-[2px]"> <div class="ml-[6px] flex items-center justify-start px-[6px] py-[2px]">
<a-checkbox-group v-model:model-value="statusFilters" direction="vertical" size="small"> <a-checkbox-group v-model:model-value="statusFilters" direction="vertical">
<a-checkbox v-for="val of Object.values(ApiScenarioStatus)" :key="val" :value="val"> <a-checkbox v-for="val of Object.values(ApiScenarioStatus)" :key="val" :value="val">
<apiStatus :status="val" /> <apiStatus :status="val" />
</a-checkbox> </a-checkbox>
@ -95,9 +95,9 @@
</template> </template>
<template #num="{ record }"> <template #num="{ record }">
<div> <div>
<MsButton type="text" class="float-left" style="margin-right: 4px" @click="openScenarioTab(record)">{{ <MsButton type="text" class="float-left" style="margin-right: 4px" @click="openScenarioTab(record)">
record.num {{ record.num }}
}}</MsButton> </MsButton>
<div v-if="record.scheduleConfig && record.scheduleConfig.enable" class="float-right"> <div v-if="record.scheduleConfig && record.scheduleConfig.enable" class="float-right">
<a-tooltip position="top"> <a-tooltip position="top">
<template #content> <template #content>
@ -114,7 +114,6 @@
</span> </span>
</template> </template>
<a-tag <a-tag
size="small"
style="border-color: #00c261; color: #00c261; background-color: transparent" style="border-color: #00c261; color: #00c261; background-color: transparent"
bordered bordered
@click="openScheduleModal(record)" @click="openScheduleModal(record)"
@ -125,7 +124,6 @@
<div v-if="record.scheduleConfig && !record.scheduleConfig.enable" class="float-right"> <div v-if="record.scheduleConfig && !record.scheduleConfig.enable" class="float-right">
<a-tooltip :content="t('apiScenario.schedule.table.tooltip.disable')" position="top"> <a-tooltip :content="t('apiScenario.schedule.table.tooltip.disable')" position="top">
<a-tag <a-tag
size="small"
style="border-color: #d4d4d8; color: #323233; background-color: transparent" style="border-color: #d4d4d8; color: #323233; background-color: transparent"
bordered bordered
@click="openScheduleModal(record)" @click="openScheduleModal(record)"
@ -144,13 +142,13 @@
@change="() => handleStatusChange(record)" @change="() => handleStatusChange(record)"
> >
<template #label> <template #label>
<apiStatus :status="record.status" size="small" /> <apiStatus :status="record.status" />
</template> </template>
<a-option v-for="item of Object.values(ApiScenarioStatus)" :key="item" :value="item"> <a-option v-for="item of Object.values(ApiScenarioStatus)" :key="item" :value="item">
<apiStatus :status="item" size="small" /> <apiStatus :status="item" />
</a-option> </a-option>
</a-select> </a-select>
<apiStatus v-else :status="record.status" size="small" /> <apiStatus v-else :status="record.status" />
</template> </template>
<template #priority="{ record }"> <template #priority="{ record }">
<a-select <a-select
@ -158,7 +156,6 @@
v-model:model-value="record.priority" v-model:model-value="record.priority"
:placeholder="t('common.pleaseSelect')" :placeholder="t('common.pleaseSelect')"
class="param-input w-full" class="param-input w-full"
size="mini"
@change="() => handlePriorityStatusChange(record)" @change="() => handlePriorityStatusChange(record)"
> >
<template #label> <template #label>
@ -647,7 +644,7 @@
ApiScenarioTableItem, ApiScenarioTableItem,
ApiScenarioUpdateDTO, ApiScenarioUpdateDTO,
} from '@/models/apiTest/scenario'; } from '@/models/apiTest/scenario';
import { DragSortParams, type TableQueryParams } from '@/models/common'; import { DragSortParams } from '@/models/common';
import { ResourcePoolItem } from '@/models/setting/resourcePool'; import { ResourcePoolItem } from '@/models/setting/resourcePool';
import { ApiScenarioStatus } from '@/enums/apiEnum'; import { ApiScenarioStatus } from '@/enums/apiEnum';
import { ReportEnum, ReportStatus } from '@/enums/reportEnum'; import { ReportEnum, ReportStatus } from '@/enums/reportEnum';
@ -900,7 +897,7 @@
]), ]),
showSelectAll: !props.readOnly, showSelectAll: !props.readOnly,
draggable: hasAnyPermission(['PROJECT_API_SCENARIO:READ+UPDATE']) ? { type: 'handle', width: 32 } : undefined, draggable: hasAnyPermission(['PROJECT_API_SCENARIO:READ+UPDATE']) ? { type: 'handle', width: 32 } : undefined,
heightUsed: 256, heightUsed: 282,
showSubdirectory: true, showSubdirectory: true,
paginationSize: 'mini', paginationSize: 'mini',
}, },
@ -1551,6 +1548,7 @@
Message.success(t('caseManagement.featureCase.sortSuccess')); Message.success(t('caseManagement.featureCase.sortSuccess'));
loadScenarioList(); loadScenarioList();
} catch (error) { } catch (error) {
// eslint-disable-next-line no-console
console.log(error); console.log(error);
} }
} }
@ -1588,5 +1586,4 @@
} }
} }
} }
.ms-table--special-small();
</style> </style>

View File

@ -27,7 +27,7 @@
</template> </template>
</MsAdvanceFilter> </MsAdvanceFilter>
<MsBaseTable <MsBaseTable
class="mt-[8px]" class="mt-[16px]"
v-bind="propsRes" v-bind="propsRes"
:action-config="tableBatchActions" :action-config="tableBatchActions"
v-on="propsEvent" v-on="propsEvent"
@ -36,12 +36,7 @@
> >
<!-- ID --> <!-- ID -->
<template #num="{ record, rowIndex }"> <template #num="{ record, rowIndex }">
<a-button <a-button type="text" class="px-0 text-[14px] leading-[22px]" @click="handleShowDetail(record.id, rowIndex)">
type="text"
class="px-0 text-[14px] leading-[22px]"
size="mini"
@click="handleShowDetail(record.id, rowIndex)"
>
{{ record.num }} {{ record.num }}
</a-button> </a-button>
</template> </template>
@ -67,9 +62,8 @@
/> />
</div> </div>
</template> </template>
<template #relationCaseCount="{ record, rowIndex }"> <template #relationCaseCount="{ record, rowIndex }">
<a-button type="text" class="px-0" size="mini" @click="showDetail(record.id, rowIndex, 'case')"> <a-button type="text" class="px-0" @click="showDetail(record.id, rowIndex, 'case')">
{{ record.relationCaseCount }} {{ record.relationCaseCount }}
</a-button> </a-button>
</template> </template>
@ -501,7 +495,7 @@
slotName: 'operation', slotName: 'operation',
dataIndex: 'operation', dataIndex: 'operation',
fixed: 'right', fixed: 'right',
width: 130, width: 140,
}, },
]; ];
@ -513,7 +507,7 @@
selectable: true, selectable: true,
noDisable: false, noDisable: false,
showSetting: true, showSetting: true,
heightUsed: 128, heightUsed: 106,
paginationSize: 'mini', paginationSize: 'mini',
}, },
(record: TableData) => ({ (record: TableData) => ({
@ -644,6 +638,7 @@
const { complete } = await getSyncStatus(appStore.currentProjectId); const { complete } = await getSyncStatus(appStore.currentProjectId);
isComplete.value = complete; isComplete.value = complete;
} catch (error) { } catch (error) {
// eslint-disable-next-line no-console
console.log(error); console.log(error);
} }
}; };
@ -890,6 +885,7 @@
} }
}); });
} catch (error) { } catch (error) {
// eslint-disable-next-line no-console
console.log(error); console.log(error);
} }
} }
@ -923,5 +919,4 @@
:deep(.arco-divider-vertical) { :deep(.arco-divider-vertical) {
margin: 0 8px; margin: 0 8px;
} }
.ms-table--special-small();
</style> </style>

View File

@ -40,7 +40,7 @@
v-bind="propsRes" v-bind="propsRes"
ref="tableRef" ref="tableRef"
filter-icon-align-left filter-icon-align-left
class="mt-[8px]" class="mt-[16px]"
:action-config="tableBatchActions" :action-config="tableBatchActions"
@selected-change="handleTableSelect" @selected-change="handleTableSelect"
v-on="propsEvent" v-on="propsEvent"
@ -60,7 +60,6 @@
v-model:model-value="record.caseLevel" v-model:model-value="record.caseLevel"
:placeholder="t('common.pleaseSelect')" :placeholder="t('common.pleaseSelect')"
class="param-input w-full" class="param-input w-full"
size="mini"
@click.stop @click.stop
@change="() => handleStatusChange(record)" @change="() => handleStatusChange(record)"
> >
@ -222,7 +221,6 @@
key: 'id', key: 'id',
children: 'children', children: 'children',
}" }"
size="mini"
:tree-props="{ :tree-props="{
virtualListProps: { virtualListProps: {
height: 200, height: 200,
@ -238,9 +236,9 @@
</template> </template>
</a-tree-select> </a-tree-select>
<a-tooltip v-else :content="getModules(record.moduleId)" position="top"> <a-tooltip v-else :content="getModules(record.moduleId)" position="top">
<span class="one-line-text inline-block" @click.stop="record.showModuleTree = true">{{ <span class="one-line-text inline-block" @click.stop="record.showModuleTree = true">
getModules(record.moduleId) {{ getModules(record.moduleId) }}
}}</span> </span>
</a-tooltip> </a-tooltip>
</template> </template>
<!-- 渲染自定义字段开始TODO --> <!-- 渲染自定义字段开始TODO -->
@ -258,18 +256,18 @@
</template> </template>
<!-- 渲染自定义字段结束 --> <!-- 渲染自定义字段结束 -->
<template #operation="{ record }"> <template #operation="{ record }">
<MsButton v-permission="['FUNCTIONAL_CASE:READ+UPDATE']" class="!mr-0" @click="operateCase(record, 'edit')">{{ <MsButton v-permission="['FUNCTIONAL_CASE:READ+UPDATE']" class="!mr-0" @click="operateCase(record, 'edit')">
t('common.edit') {{ t('common.edit') }}
}}</MsButton> </MsButton>
<a-divider <a-divider
v-permission="['FUNCTIONAL_CASE:READ+UPDATE']" v-permission="['FUNCTIONAL_CASE:READ+UPDATE']"
class="!mx-2 h-[12px]" class="!mx-2 h-[12px]"
direction="vertical" direction="vertical"
:margin="8" :margin="8"
></a-divider> ></a-divider>
<MsButton v-permission="['FUNCTIONAL_CASE:READ+ADD']" class="!mr-0" @click="operateCase(record, 'copy')">{{ <MsButton v-permission="['FUNCTIONAL_CASE:READ+ADD']" class="!mr-0" @click="operateCase(record, 'copy')">
t('caseManagement.featureCase.copy') {{ t('caseManagement.featureCase.copy') }}
}}</MsButton> </MsButton>
<a-divider <a-divider
v-permission="['FUNCTIONAL_CASE:READ+ADD']" v-permission="['FUNCTIONAL_CASE:READ+ADD']"
class="!mx-2 h-[12px]" class="!mx-2 h-[12px]"
@ -451,7 +449,6 @@
} from '@/models/caseManagement/featureCase'; } from '@/models/caseManagement/featureCase';
import type { TableQueryParams } from '@/models/common'; import type { TableQueryParams } from '@/models/common';
import { ModuleTreeNode } from '@/models/common'; import { ModuleTreeNode } from '@/models/common';
import { LastExecuteResults } from '@/enums/caseEnum';
import { CaseManagementRouteEnum } from '@/enums/routeEnum'; import { CaseManagementRouteEnum } from '@/enums/routeEnum';
import { ColumnEditTypeEnum, TableKeyEnum } from '@/enums/tableEnum'; import { ColumnEditTypeEnum, TableKeyEnum } from '@/enums/tableEnum';
@ -699,7 +696,7 @@
fixed: 'right', fixed: 'right',
showInTable: true, showInTable: true,
showDrag: false, showDrag: false,
width: hasOperationPermission.value ? 130 : 50, width: hasOperationPermission.value ? 140 : 50,
}, },
]; ];
const platformInfo = ref<Record<string, any>>({}); const platformInfo = ref<Record<string, any>>({});
@ -907,7 +904,7 @@
tableKey: TableKeyEnum.CASE_MANAGEMENT_TABLE, tableKey: TableKeyEnum.CASE_MANAGEMENT_TABLE,
selectable: true, selectable: true,
showSetting: true, showSetting: true,
heightUsed: 256, heightUsed: 236,
enableDrag: true, enableDrag: true,
showSubdirectory: true, showSubdirectory: true,
paginationSize: 'mini', paginationSize: 'mini',
@ -1732,7 +1729,6 @@
flex-direction: row; flex-direction: row;
justify-content: space-between; justify-content: space-between;
} }
.ms-table--special-small();
.tree-dropdown { .tree-dropdown {
.arco-tree-select-tree-wrapper { .arco-tree-select-tree-wrapper {
width: 200px !important; width: 200px !important;

View File

@ -1,6 +1,6 @@
<template> <template>
<div class="px-[24px] py-[8px]"> <div class="px-[24px] py-[16px]">
<div class="mb-[8px] flex flex-wrap items-center justify-end"> <div class="mb-[16px] flex flex-wrap items-center justify-end">
<MsAdvanceFilter <MsAdvanceFilter
v-model:keyword="keyword" v-model:keyword="keyword"
:filter-config-list="filterConfigList" :filter-config-list="filterConfigList"
@ -69,7 +69,7 @@
</template> </template>
<template #num="{ record }"> <template #num="{ record }">
<a-tooltip :content="record.num"> <a-tooltip :content="record.num">
<a-button type="text" class="px-0 !text-[14px] !leading-[22px]" size="mini" @click="review(record)"> <a-button type="text" class="px-0 !text-[14px] !leading-[22px]" @click="review(record)">
<div class="one-line-text max-w-[168px]">{{ record.num }}</div> <div class="one-line-text max-w-[168px]">{{ record.num }}</div>
</a-button> </a-button>
</a-tooltip> </a-tooltip>
@ -97,7 +97,6 @@
:tag-list="record.reviewNames" :tag-list="record.reviewNames"
is-string-tag is-string-tag
:show-num="1" :show-num="1"
size="small"
theme="outline" theme="outline"
@click="record.showModuleTree = false" @click="record.showModuleTree = false"
/> />
@ -110,7 +109,6 @@
:options="reviewersOptions" :options="reviewersOptions"
:search-keys="['label']" :search-keys="['label']"
allow-search allow-search
size="mini"
:multiple="true" :multiple="true"
:placeholder="t('project.messageManagement.receiverPlaceholder')" :placeholder="t('project.messageManagement.receiverPlaceholder')"
@click.stop="record.showModuleTree = true" @click.stop="record.showModuleTree = true"
@ -455,7 +453,7 @@
{ {
scroll: { x: '100%' }, scroll: { x: '100%' },
tableKey: TableKeyEnum.CASE_MANAGEMENT_REVIEW_CASE, tableKey: TableKeyEnum.CASE_MANAGEMENT_REVIEW_CASE,
heightUsed: 375, heightUsed: 399,
showSetting: true, showSetting: true,
selectable: true, selectable: true,
showSelectAll: true, showSelectAll: true,
@ -943,5 +941,4 @@
} }
} }
} }
.ms-table--special-small();
</style> </style>

View File

@ -102,19 +102,18 @@
</template> </template>
<template #num="{ record }"> <template #num="{ record }">
<a-tooltip :content="`${record.num}`"> <a-tooltip :content="`${record.num}`">
<a-button type="text" class="px-0 !text-[14px] !leading-[22px]" size="mini" @click="openDetail(record.id)"> <a-button type="text" class="px-0 !text-[14px] !leading-[22px]" @click="openDetail(record.id)">
<div class="one-line-text max-w-[168px]">{{ record.num }}</div> <div class="one-line-text max-w-[168px]">{{ record.num }}</div>
</a-button> </a-button>
</a-tooltip> </a-tooltip>
</template> </template>
<template #status="{ record }"> <template #status="{ record }">
<MsStatusTag :status="record.status" size="small" /> <MsStatusTag :status="record.status" />
</template> </template>
<template #reviewPassRule="{ record }"> <template #reviewPassRule="{ record }">
<a-tag <a-tag
:color="record.reviewPassRule === 'SINGLE' ? 'rgb(var(--success-2))' : 'rgb(var(--link-2))'" :color="record.reviewPassRule === 'SINGLE' ? 'rgb(var(--success-2))' : 'rgb(var(--link-2))'"
:class="record.reviewPassRule === 'SINGLE' ? '!text-[rgb(var(--success-6))]' : '!text-[rgb(var(--link-6))]'" :class="record.reviewPassRule === 'SINGLE' ? '!text-[rgb(var(--success-6))]' : '!text-[rgb(var(--link-6))]'"
size="small"
> >
{{ {{
record.reviewPassRule === 'SINGLE' record.reviewPassRule === 'SINGLE'
@ -442,7 +441,7 @@
title: 'caseManagement.caseReview.caseCount', title: 'caseManagement.caseReview.caseCount',
dataIndex: 'caseCount', dataIndex: 'caseCount',
showDrag: true, showDrag: true,
width: 90, width: 100,
}, },
{ {
title: 'caseManagement.caseReview.status', title: 'caseManagement.caseReview.status',
@ -464,7 +463,7 @@
slotName: 'reviewPassRule', slotName: 'reviewPassRule',
dataIndex: 'reviewPassRule', dataIndex: 'reviewPassRule',
showDrag: true, showDrag: true,
width: 90, width: 100,
}, },
{ {
title: 'caseManagement.caseReview.reviewer', title: 'caseManagement.caseReview.reviewer',
@ -526,7 +525,7 @@
showSetting: true, showSetting: true,
selectable: true, selectable: true,
showSelectAll: true, showSelectAll: true,
heightUsed: 256, heightUsed: 232,
showSubdirectory: true, showSubdirectory: true,
paginationSize: 'mini', paginationSize: 'mini',
}, },
@ -801,6 +800,4 @@
} }
</script> </script>
<style lang="less" scoped> <style lang="less" scoped></style>
.ms-table--special-small();
</style>

View File

@ -1,5 +1,5 @@
<template> <template>
<div class="flex h-[calc(100vh-88px)] flex-col p-[16px]"> <div class="flex h-full flex-col p-[16px]">
<div class="header"> <div class="header">
<a-button v-permission="['PROJECT_FILE_MANAGEMENT:READ+ADD']" type="primary" @click="handleAddClick"> <a-button v-permission="['PROJECT_FILE_MANAGEMENT:READ+ADD']" type="primary" @click="handleAddClick">
{{ t('project.fileManagement.addFile') }} {{ t('project.fileManagement.addFile') }}
@ -554,7 +554,7 @@
title: 'project.fileManagement.type', title: 'project.fileManagement.type',
slotName: 'fileType', slotName: 'fileType',
dataIndex: 'fileType', dataIndex: 'fileType',
width: 90, width: 100,
}, },
{ {
title: 'project.fileManagement.size', title: 'project.fileManagement.size',
@ -609,6 +609,7 @@
'PROJECT_FILE_MANAGEMENT:READ+UPDATE', 'PROJECT_FILE_MANAGEMENT:READ+UPDATE',
'PROJECT_FILE_MANAGEMENT:READ+DELETE', 'PROJECT_FILE_MANAGEMENT:READ+DELETE',
]), ]),
heightUsed: 242,
showSelectAll: true, showSelectAll: true,
showSubdirectory: true, showSubdirectory: true,
}, },

View File

@ -394,7 +394,7 @@
columns, columns,
selectable: !!hasAnyPermission(['SYSTEM_USER:READ+UPDATE', 'SYSTEM_USER:READ+DELETE']), selectable: !!hasAnyPermission(['SYSTEM_USER:READ+UPDATE', 'SYSTEM_USER:READ+DELETE']),
showSetting: true, showSetting: true,
heightUsed: 288, heightUsed: 238,
}, },
(record) => ({ (record) => ({
...record, ...record,