style: 表格分页&批量操作样式调整

This commit is contained in:
RubyLiu 2023-09-25 15:17:42 +08:00 committed by 刘瑞斌
parent 3e4b1ffcf2
commit 7c25a87ef8
4 changed files with 10 additions and 10 deletions

View File

@ -630,11 +630,10 @@
} }
} }
&-total { &-total {
margin-right: 16px !important; color: var(--color-text-2);
color: var(--color-text-2) !important;
} }
&-options { &-options {
margin-left: 0 !important; margin-left: 14px;
} }
&-item { &-item {
display: flex; display: flex;
@ -646,7 +645,7 @@
box-sizing: border-box; box-sizing: border-box;
cursor: pointer; cursor: pointer;
&-previous { &-previous {
margin-left: 14px !important; margin-left: 14px;
} }
&-ellipsis { &-ellipsis {
padding: 5px 0; padding: 5px 0;

View File

@ -399,7 +399,7 @@ export default defineComponent({
{slots.total?.({ total: props.total }) ?? t('msPagination.total', { total: props.total })} {slots.total?.({ total: props.total }) ?? t('msPagination.total', { total: props.total })}
</span> </span>
)} )}
{props.showPageSize && ( {props.showPageSize && !props.simple && (
<PageOptions <PageOptions
disabled={props.disabled} disabled={props.disabled}
sizeOptions={props.pageSizeOptions} sizeOptions={props.pageSizeOptions}

View File

@ -145,7 +145,7 @@
</template> </template>
</a-table> </a-table>
<div <div
class="mt-[16px] flex h-[32px] w-[100%] flex-row flex-nowrap items-center justify-end px-0" class="mt-[16px] flex h-[32px] w-[100%] min-w-[952px] flex-row flex-nowrap items-center justify-end px-0"
:class="{ 'justify-between': showBatchAction }" :class="{ 'justify-between': showBatchAction }"
> >
<batch-action <batch-action

View File

@ -1,20 +1,21 @@
<template> <template>
<div v-if="props.actionConfig" class="ms-table__patch-action"> <div v-if="props.actionConfig" class="ms-table__patch-action">
<span class="title">{{ t('msTable.batch.selected', { count: props.selectRowCount }) }}</span> <span class="title">{{ t('msTable.batch.selected', { count: props.selectRowCount }) }}</span>
<template v-for="element in props.actionConfig.baseAction" :key="element.label"> <template v-for="(element, idx) in props.actionConfig.baseAction" :key="element.label">
<a-divider v-if="element.isDivider" class="mx-0 my-[6px]" /> <a-divider v-if="element.isDivider" class="mx-0 my-[6px]" />
<a-button <a-button
v-else v-else
class="ml-[12px]"
:class="{ :class="{
'arco-btn-outline--danger': element.danger, 'arco-btn-outline--danger': element.danger,
'ml-4': true, 'ml-[16px]': idx === 0,
}" }"
type="outline" type="outline"
@click="handleSelect(element)" @click="handleSelect(element)"
>{{ t(element.label as string) }}</a-button >{{ t(element.label as string) }}</a-button
> >
</template> </template>
<div v-if="props.actionConfig.moreAction" class="relative top-[2px] ml-3 inline-block"> <div v-if="props.actionConfig.moreAction" class="relative top-[2px] ml-[16px] inline-block">
<a-dropdown position="tr" @select="handleSelect"> <a-dropdown position="tr" @select="handleSelect">
<a-button type="outline"><MsIcon type="icon-icon_more_outlined" /></a-button> <a-button type="outline"><MsIcon type="icon-icon_more_outlined" /></a-button>
<template #content> <template #content>
@ -27,7 +28,7 @@
</template> </template>
</a-dropdown> </a-dropdown>
</div> </div>
<a-button class="ml-3" type="text" @click="emit('clear')">{{ t('msTable.batch.clear') }}</a-button> <a-button class="ml-[16px]" type="text" @click="emit('clear')">{{ t('msTable.batch.clear') }}</a-button>
</div> </div>
</template> </template>