This commit is contained in:
pa
2026-01-07 17:00:11 +09:00
committed by Natsumi
parent 6cfefb50ab
commit 02e221e307
12 changed files with 43 additions and 61 deletions

View File

@@ -6,7 +6,7 @@
<div class="rounded-md border">
<div v-loading="loading" class="overflow-auto" :style="tableStyle">
<Table class="table-fixed">
<Table :class="tableClassValue" :style="tableElementStyle">
<TableHeader>
<TableRow v-for="headerGroup in table.getHeaderGroups()" :key="headerGroup.id">
<TableHead
@@ -119,6 +119,14 @@
type: Object,
required: true
},
tableClass: {
type: [String, Array],
default: null
},
useTableMinWidth: {
type: Boolean,
default: false
},
tableStyle: {
type: Object,
default: null
@@ -184,6 +192,15 @@
.filter(Boolean)
.join(' ');
const tableClassValue = computed(() => joinClasses('table-fixed', props.tableClass));
const tableElementStyle = computed(() => {
if (!props.useTableMinWidth) return undefined;
const size = props.table?.getTotalSize?.();
if (!Number.isFinite(size) || size <= 0) return undefined;
return { minWidth: `${size}px` };
});
const resolveClassValue = (value, ctx) => {
if (typeof value === 'function') {
return value(ctx);

View File

@@ -2,7 +2,8 @@
import { cn } from '@/lib/utils';
const props = defineProps({
class: { type: null, required: false }
class: { type: null, required: false },
style: { type: [String, Array, Object], required: false }
});
</script>
@@ -10,7 +11,8 @@
<div data-slot="table-container" class="relative w-full">
<table
data-slot="table"
:class="cn('w-full caption-bottom text-[13px] in-[.is-compact-table]:text-[12px]', props.class)">
:class="cn('w-full caption-bottom text-[13px] in-[.is-compact-table]:text-[12px]', props.class)"
:style="props.style">
<slot />
</table>
</div>

View File

@@ -24,18 +24,8 @@ export const useFeedStore = defineStore('Feed', () => {
vip: false,
loading: false,
filter: [],
tableProps: {
stripe: true,
size: 'small',
defaultSort: null,
rowKey: (row) =>
`${row.type}:${row.rowId ?? row.uid}:${row.created_at ?? ''}`
},
pageSize: 20,
pageSizeLinked: true,
paginationProps: {
layout: 'sizes,prev,pager,next,total'
}
pageSizeLinked: true
});
const feedSessionTable = ref([]);

View File

@@ -87,16 +87,8 @@ export const useFriendStore = defineStore('Friend', () => {
!(filter.value && row.type === 'Unfriend')
}
],
tableProps: {
stripe: true,
size: 'small',
defaultSort: null
},
pageSize: 20,
pageSizeLinked: true,
paginationProps: {
layout: 'sizes,prev,pager,next,total'
}
pageSizeLinked: true
});
const vipFriends = computed(() => {

View File

@@ -63,18 +63,8 @@ export const useGameLogStore = defineStore('GameLog', () => {
loading: false,
search: '',
filter: [],
tableProps: {
stripe: true,
size: 'small',
defaultSort: null,
rowKey: (row) =>
`${row.type}:${row.rowId ?? row.uid ?? row.displayName + row.location + row.time}:${row.created_at ?? ''}`
},
pageSize: 20,
pageSizeLinked: true,
paginationProps: {
layout: 'sizes,prev,pager,next,total'
},
vip: false
});

View File

@@ -26,19 +26,8 @@ export const useModerationStore = defineStore('Moderation', () => {
value: ''
}
],
tableProps: {
stripe: true,
size: 'small',
defaultSort: {
prop: 'created',
order: 'descending'
}
},
pageSize: 20,
pageSizeLinked: true,
paginationProps: {
layout: 'sizes,prev,pager,next,total'
}
pageSizeLinked: true
});
watch(

View File

@@ -286,7 +286,7 @@ export const columns = [
header: () => t('table.feed.detail'),
enableSorting: false,
meta: {
class: 'min-w-0 overflow-hidden'
class: 'min-w-[240px] overflow-hidden'
},
cell: ({ row }) => {
const original = row.original;

View File

@@ -32,7 +32,7 @@ export const createColumns = ({ onDelete, onDeletePrompt }) => {
{
accessorKey: 'created_at',
meta: {
class: 'w-[140px]'
class: 'w-[90px]'
},
header: ({ column }) => (
<Button
@@ -67,7 +67,7 @@ export const createColumns = ({ onDelete, onDeletePrompt }) => {
{
accessorKey: 'type',
meta: {
class: 'w-[180px]'
class: 'w-[110px]'
},
header: () => t('table.friendLog.type'),
cell: ({ row }) => {
@@ -82,7 +82,7 @@ export const createColumns = ({ onDelete, onDeletePrompt }) => {
{
accessorKey: 'displayName',
meta: {
class: 'min-w-0 overflow-hidden'
class: 'w-[260px]'
},
header: () => t('table.friendLog.user'),
cell: ({ row }) => {
@@ -90,7 +90,7 @@ export const createColumns = ({ onDelete, onDeletePrompt }) => {
const displayName =
original.displayName || original.userId || '';
return (
<span class="block w-full min-w-0 truncate">
<span class="block w-full whitespace-normal break-words">
{original.type === 'DisplayName' ? (
<span class="mr-1">
{original.previousDisplayName}

View File

@@ -139,9 +139,9 @@ export const createColumns = ({ getCreatedAt, onDelete, onDeletePrompt }) => {
id: 'detail',
header: () => t('table.gameLog.detail'),
enableSorting: false,
meta: {
class: 'min-w-0 overflow-hidden'
},
meta: {
class: 'min-w-[240px] overflow-hidden'
},
cell: ({ row }) => {
const original = row.original;
if (original.type === 'Location') {

View File

@@ -33,7 +33,7 @@ export const createColumns = ({ onDelete, onDeletePrompt }) => {
{
accessorKey: 'created',
meta: {
class: 'w-[140px]'
class: 'w-[90px]'
},
header: ({ column }) => (
<Button
@@ -68,7 +68,7 @@ export const createColumns = ({ onDelete, onDeletePrompt }) => {
{
accessorKey: 'type',
meta: {
class: 'w-[160px]'
class: 'w-[80px]'
},
header: () => t('table.moderation.type'),
cell: ({ row }) => {
@@ -83,7 +83,7 @@ export const createColumns = ({ onDelete, onDeletePrompt }) => {
{
accessorKey: 'sourceDisplayName',
meta: {
class: 'w-[200px] min-w-0 overflow-hidden'
class: 'w-[120px] min-w-0 overflow-hidden'
},
header: () => t('table.moderation.source'),
cell: ({ row }) => {
@@ -101,14 +101,14 @@ export const createColumns = ({ onDelete, onDeletePrompt }) => {
{
accessorKey: 'targetDisplayName',
meta: {
class: 'min-w-0 overflow-hidden'
class: 'w-[200px]'
},
header: () => t('table.moderation.target'),
cell: ({ row }) => {
const original = row.original;
return (
<span
class="x-link block w-full min-w-0 truncate pr-2.5"
class="x-link block w-full whitespace-normal break-words pr-2.5"
onClick={() => showUserDialog(original.targetUserId)}
>
{original.targetDisplayName}

View File

@@ -179,10 +179,12 @@
<PhotonEventTable @show-chatbox-blacklist="showChatboxBlacklistDialog" />
</div>
<div class="current-instance-table flex min-h-0 flex-1">
<div class="current-instance-table flex min-h-0 min-w-0 flex-1">
<DataTableLayout
class="[&_th]:px-2.5! [&_th]:py-0.75! [&_td]:px-2.5! [&_td]:py-0.75! [&_tr]:h-7!"
class="min-w-0 w-full [&_th]:px-2.5! [&_th]:py-0.75! [&_td]:px-2.5! [&_td]:py-0.75! [&_tr]:h-7!"
:table="playerListTable"
table-class="min-w-max w-max"
:use-table-min-width="true"
:table-style="playerListTableStyle"
:loading="false"
:total-items="playerListTotalItems"

View File

@@ -147,7 +147,7 @@ export const createColumns = ({
minSize: 200,
enableSorting: false,
meta: {
class: 'min-w-[200px]'
class: 'w-[200px]'
},
cell: ({ row }) => {
const userRef = row.original?.ref;