WindyMadman/fortune-sheet
1
0
Fork 0
mirror of https://github.com/ruilisi/fortune-sheet.git synced 2025-01-09 04:07:33 +08:00
Code Issues Packages Projects Releases Wiki Activity

fix: Style error when moving selection while freezing cells

Browse Source
This commit is contained in:
ZhengIce 2023-03-28 19:08:59 +08:00 committed by Qaplagzy
parent f6b12bf61f
commit fe6a7bb59d
4 changed files with 94 additions and 38 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

85
packages/core/src/modules/selection.ts
View File

@ -2212,22 +2212,48 @@ export function selectAll(ctx: Context) {
export function getSelectionStyle(
ctx: Context,
selection: Selection,
freeze: Freezen | undefined
freeze: Freezen | undefined,
selection?: Selection,
mark?: "row" | "col" | "foc",
h1?: number,
h2?: number
): {
left: number | undefined;
top: number | undefined;
width: number | undefined;
height: number | undefined;
width: number | undefined | string;
height: number | undefined | string;
display: string;
} {
const ret = {
left: selection.left_move,
top: selection.top_move,
width: selection.width_move,
height: selection.height_move,
display: "block",
};
let ret: any = null;
if (mark) {
if (mark === "foc") {
ret = {
display: "block",
left: _.last(ctx.luckysheet_select_save)?.left,
width: _.last(ctx.luckysheet_select_save)?.width,
top: _.last(ctx.luckysheet_select_save)?.top,
height: _.last(ctx.luckysheet_select_save)?.height,
};
} else {
ret = {
left: mark === "col" ? h1 : 0,
top: mark === "row" ? h1 : 0,
width: mark === "col" ? h2 : "100%",
height: mark === "row" ? h2 : "100%",
display: "block",
backgroundColor: "rgba(76, 76, 76, 0.1)",
};
}
} else {
ret = {
left: selection?.left_move,
top: selection?.top_move,
width: selection?.width_move,
height: selection?.height_move,
display: "block",
};
}
if (!freeze) return ret;
const { scrollTop } = ctx;
@ -2240,13 +2266,25 @@ export function getSelectionStyle(
let rangeshow = true;
if (freezenhorizontaldata != null) {
if (freezenhorizontaldata != null && mark !== "col") {
const freezenTop = freezenhorizontaldata[0];
const freezen_rowindex = freezenhorizontaldata[1];
const offTop = scrollTop - freezenhorizontaldata[2];
const r1 = obj.row[0];
const r2 = obj.row[1];
let r1: number = 0;
let r2: number = 0;
if (mark) {
if (mark === "foc") {
r1 = _.cloneDeep(ctx.luckysheet_select_save?.[0].row_focus!);
r2 = r1;
} else {
r1 = _.cloneDeep(ctx.luckysheet_select_save?.[0].row[0]!);
r2 = _.cloneDeep(ctx.luckysheet_select_save?.[0].row[1]!);
}
} else {
[r1] = obj!.row;
[, r2] = obj!.row;
}
const row = ctx.visibledatarow[r2];
const row_pre = r1 - 1 === -1 ? 0 : ctx.visibledatarow[r1 - 1];
@ -2278,13 +2316,26 @@ export function getSelectionStyle(
}
}
if (freezenverticaldata != null) {
if (freezenverticaldata != null && mark !== "row") {
const freezenLeft = freezenverticaldata[0];
const freezen_colindex = freezenverticaldata[1];
const offLeft = scrollLeft - freezenverticaldata[2];
const c1 = obj.column[0];
const c2 = obj.column[1];
let c1: number = 0;
let c2: number = 0;
if (mark) {
if (mark === "foc") {
c1 = _.cloneDeep(ctx.luckysheet_select_save?.[0].column_focus!);
c2 = c1;
} else {
c1 = _.cloneDeep(ctx.luckysheet_select_save?.[0].column[0]!);
c2 = _.cloneDeep(ctx.luckysheet_select_save?.[0].column[1]!);
}
} else {
[c1] = obj!.column;
[, c2] = obj!.column;
}
const col = ctx.visibledatacolumn[c2];
const col_pre = c1 - 1 === -1 ? 0 : ctx.visibledatacolumn[c1 - 1];

15
packages/react/src/components/SheetOverlay/ColumnHeader.tsx
View File

@ -6,6 +6,7 @@ import {
handleColSizeHandleMouseDown,
handleColumnHeaderMouseDown,
handleContextMenu,
getSelectionStyle,
} from "@fortune-sheet/core";
import _ from "lodash";
import React, {
@ -193,12 +194,14 @@ const ColumnHeader: React.FC = () => {
<div
className="fortune-col-header-selected"
key={i}
style={{
left: col_pre,
width: col - col_pre - 1,
display: "block",
backgroundColor: "rgba(76, 76, 76, 0.1)",
}}
style={getSelectionStyle(
context,
refs.globalCache.freezen?.[context.currentSheetId],
undefined,
"col",
col_pre,
col - col_pre - 1
)}
/>
))}
{/* placeholder to overflow the container, making the container scrollable */}

15
packages/react/src/components/SheetOverlay/RowHeader.tsx
View File

@ -6,6 +6,7 @@ import {
handleContextMenu,
handleRowHeaderMouseDown,
handleRowSizeHandleMouseDown,
getSelectionStyle,
} from "@fortune-sheet/core";
import _ from "lodash";
import React, {
@ -173,12 +174,14 @@ const RowHeader: React.FC = () => {
<div
className="fortune-row-header-selected"
key={i}
style={{
top: row_pre,
height: row - row_pre - 1,
display: "block",
backgroundColor: "rgba(76, 76, 76, 0.1)",
}}
style={getSelectionStyle(
context,
refs.globalCache.freezen?.[context.currentSheetId],
undefined,
"row",
row_pre,
row - row_pre - 1
)}
/>
))}
{/* placeholder to overflow the container, making the container scrollable */}

17
packages/react/src/components/SheetOverlay/index.tsx
View File

@ -482,13 +482,12 @@ const SheetOverlay: React.FC = () => {
className="luckysheet-cell-selected-focus"
style={
(context.luckysheet_select_save?.length ?? 0) > 0
? {
display: "block",
left: _.last(context.luckysheet_select_save)?.left,
width: _.last(context.luckysheet_select_save)?.width,
top: _.last(context.luckysheet_select_save)?.top,
height: _.last(context.luckysheet_select_save)?.height,
}
? getSelectionStyle(
context,
refs.globalCache.freezen?.[context.currentSheetId],
undefined,
"foc"
)
: {}
}
onMouseDown={(e) => e.preventDefault()}
@ -545,8 +544,8 @@ const SheetOverlay: React.FC = () => {
className="luckysheet-cell-selected"
style={getSelectionStyle(
context,
selection,
refs.globalCache.freezen?.[context.currentSheetId]
refs.globalCache.freezen?.[context.currentSheetId],
selection
)}
onMouseDown={(e) => {
e.stopPropagation();