OpenSource/misskey
OpenSource/misskey
1
0
Fork 0
mirror of https://github.com/misskey-dev/misskey.git synced 2025-01-05 03:55:28 +01:00
Code Issues Projects Releases Packages Wiki Activity

fix size

Browse source
This commit is contained in:
samunohito 2024-01-29 11:28:08 +09:00
parent ff14249507
commit e0ad0f2aae
3 changed files with 28 additions and 16 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
packages/frontend/src/components/grid/MkDataCell.vue
View file

@ -89,7 +89,7 @@ const needsContentCentering = computed(() => {
watch(() => [cell, cell.value.value], () => {
// 中身がセットされた直後はサイズが分からないので、次のタイミングで更新する
nextTick(emitContentSizeChanged);
});
}, { immediate: true });
watch(() => cell.value.selected, () => {
if (cell.value.selected) {
rootEl.value?.focus();

38
packages/frontend/src/components/grid/MkGrid.vue
View file

@ -462,6 +462,9 @@ function onChangeCellValue(sender: GridCell, newValue: CellValue) {
function onChangeCellContentSize(sender: GridCell, contentSize: Size) {
cells.value[sender.address.row][sender.address.col].contentSize = contentSize;
if (sender.column.setting.width === 'auto') {
largestCellWidth(sender.column);
}
}
function onHeaderCellWidthBeginChange() {
@ -496,6 +499,9 @@ function onHeaderCellChangeContentSize(sender: GridColumn, newSize: Size) {
switch (state.value) {
case 'normal': {
columns.value[sender.index].contentSize = newSize;
if (sender.setting.width === 'auto') {
largestCellWidth(sender);
}
break;
}
}
@ -504,24 +510,30 @@ function onHeaderCellChangeContentSize(sender: GridColumn, newSize: Size) {
function onHeaderCellWidthLargest(sender: GridColumn) {
switch (state.value) {
case 'normal': {
const column = columns.value[sender.index];
const _cells = cells.value;
const largestColumnWidth = columns.value.reduce(
(acc, value) => Math.max(acc, value.contentSize.width),
columns.value[sender.index].contentSize.width,
);
const largestCellWidth = _cells
.map(row => row[column.index])
.reduce(
(acc, value) => Math.max(acc, value.contentSize.width),
_cells[0][column.index].contentSize.width,
);
column.width = `${Math.max(largestColumnWidth, largestCellWidth)}px`;
largestCellWidth(sender);
break;
}
}
}
function largestCellWidth(column: GridColumn) {
const _cells = cells.value;
const largestColumnWidth = columns.value[column.index].contentSize.width;
const largestCellWidth = (_cells.length > 0)
? _cells
.map(row => row[column.index])
.reduce(
(acc, value) => Math.max(acc, value.contentSize.width),
0,
)
: 0;
console.log(`largestCellWidth: ${largestColumnWidth}, ${largestCellWidth}`);
column.width = `${Math.max(largestColumnWidth, largestCellWidth)}px`;
}
function setCellValue(sender: GridCell | CellAddress, newValue: CellValue) {
const cellAddress = 'address' in sender ? sender.address : sender;
const cell = cells.value[cellAddress.row][cellAddress.col];

4
packages/frontend/src/components/grid/MkHeaderCell.vue
View file

@ -2,7 +2,7 @@
<th
ref="rootEl"
:class="$style.cell"
:style="[{ width: column.width }]"
:style="[{ maxWidth: column.width, minWidth: column.width, width: column.width }]"
>
<div :class="$style.root">
<div :class="$style.left"/>
@ -52,7 +52,7 @@ const text = computed(() => {
watch(column, () => {
// 中身がセットされた直後はサイズが分からないので、次のタイミングで更新する
nextTick(updateContentSize);
});
}, { immediate: true });
function onHandleDoubleClick(ev: MouseEvent) {
switch (ev.type) {