diff --git a/src/controllers/freezen.js b/src/controllers/freezen.js index b9bd4df..500b976 100644 --- a/src/controllers/freezen.js +++ b/src/controllers/freezen.js @@ -32,9 +32,9 @@ const luckysheetFreezen = { let premax = pre[pre.length - 1]; let ret = arr.slice(cutindex); - for (let i = 0; i < ret.length; i++) { - ret[i] -= premax; - } + // for (let i = 0; i < ret.length; i++) { + // ret[i] -= premax; + // } return ret; }, diff --git a/src/css/luckysheet-core.css b/src/css/luckysheet-core.css index 5cb0e1d..d8bce99 100644 --- a/src/css/luckysheet-core.css +++ b/src/css/luckysheet-core.css @@ -1221,6 +1221,7 @@ div.luckysheet-sheets-add:hover, div.luckysheet-sheets-m:hover { outline-style: none; position: relative; -webkit-user-select: none; + background: #f3f3f2; } .luckysheet-rows-h { @@ -1234,6 +1235,7 @@ div.luckysheet-sheets-add:hover, div.luckysheet-sheets-m:hover { cursor: default; /*height: 472px;*/ width: 38px; + background: #f3f3f2; } .luckysheet-cols-menu-btn { @@ -1685,7 +1687,7 @@ body:not(.ewa-ipad) .luckysheet-cols-h-cell-nosel:hover, body:not(.ewa-ipad) .lu /*width: 400px;*/ /* background: #000; */ bottom: 68px; - left: 10px; + left: 0px; z-index: 1000; } @@ -4484,8 +4486,8 @@ fieldset[disabled] a.btn { } .luckysheet-freezebar-vertical-drop-bar { - width: 4px; - background-color: #f3f3f2; + width: 2px; + background:rgba(0, 0, 0, 0.45); border-width: 2px 1px 2px 2px; margin-top: 19px; top: 0px; @@ -4493,7 +4495,7 @@ fieldset[disabled] a.btn { } .luckysheet-freezebar-vertical-drop-title { - width: 4px; + width: 2px; background: #bcbdbc; /* opacity: 0.80; filter: alpha(opacity=80);*/ @@ -4504,10 +4506,12 @@ fieldset[disabled] a.btn { .luckysheet-freezebar-hover .luckysheet-freezebar-vertical-drop-bar, .luckysheet-freezebar-active .luckysheet-freezebar-vertical-drop-bar { background: #C1C1C1; + width: 4px; } .luckysheet-freezebar-hover .luckysheet-freezebar-vertical-drop-title, .luckysheet-freezebar-active .luckysheet-freezebar-vertical-drop-title { background: #5D88DB; + width: 4px; } @@ -4550,9 +4554,9 @@ fieldset[disabled] a.btn { } .luckysheet-freezebar-horizontal-drop-bar { - height: 4px; + height: 2px; overflow: hidden; - background-color: #f3f3f2; + background:rgba(0, 0, 0, 0.45); border-width: 2px 2px 1px 2px; margin-left: 45px; left: 0px; @@ -4561,7 +4565,7 @@ fieldset[disabled] a.btn { .luckysheet-freezebar-horizontal-drop-title { - height: 4px; + height: 2px; background: #bcbdbc; /* opacity: 0.80; filter: alpha(opacity=80);*/ @@ -4571,10 +4575,12 @@ fieldset[disabled] a.btn { .luckysheet-freezebar-hover .luckysheet-freezebar-horizontal-drop-bar, .luckysheet-freezebar-active .luckysheet-freezebar-horizontal-drop-bar { background: #C1C1C1; + height: 4px; } .luckysheet-freezebar-hover .luckysheet-freezebar-horizontal-drop-title, .luckysheet-freezebar-active .luckysheet-freezebar-horizontal-drop-title { background: #5D88DB; + height: 4px; } diff --git a/src/global/draw.js b/src/global/draw.js index 3cee455..0829e2b 100644 --- a/src/global/draw.js +++ b/src/global/draw.js @@ -16,19 +16,6 @@ import { getObjType, chatatABC, luckysheetfontformat } from '../utils/util'; import Store from '../store'; import locale from '../locale/locale'; -function luckysheetDrawgrid(scrollWidth, scrollHeight, drawWidth, drawHeight, offsetLeft, offsetTop) { - if($("#luckysheetTableContent").length == 0){ - return; - } - - luckysheetDrawMain(scrollWidth, scrollHeight, drawWidth, drawHeight, offsetLeft, offsetTop); - - $("#luckysheetTableContent").get(0).getContext("2d").clearRect(0, 0, 46, 20); - - luckysheetDrawgridColumnTitle(scrollWidth, drawWidth, offsetLeft); - luckysheetDrawgridRowTitle(scrollHeight, drawHeight, offsetTop); -} - function luckysheetDrawgridRowTitle(scrollHeight, drawHeight, offsetTop) { if (scrollHeight == null) { scrollHeight = $("#luckysheet-cell-main").scrollTop(); @@ -65,6 +52,11 @@ function luckysheetDrawgridRowTitle(scrollHeight, drawHeight, offsetTop) { dataset_row_ed = Store.visibledatarow.length - 1; } + luckysheetTableContent.save(); + luckysheetTableContent.beginPath(); + luckysheetTableContent.rect(0, offsetTop* Store.devicePixelRatio, Store.rowHeaderWidth * Store.devicePixelRatio-1, drawHeight-2); + luckysheetTableContent.clip(); + let end_r, start_r; for (let r = dataset_row_st; r <= dataset_row_ed; r++) { @@ -85,6 +77,16 @@ function luckysheetDrawgridRowTitle(scrollHeight, drawHeight, offsetTop) { } else { + + luckysheetTableContent.fillStyle = "#ffffff"; + luckysheetTableContent.fillRect( + 0, + (start_r + offsetTop) * Store.devicePixelRatio, + Store.rowHeaderWidth * Store.devicePixelRatio-1, + (end_r - start_r - 1) * Store.devicePixelRatio + ) + luckysheetTableContent.fillStyle = "#000000"; + //行标题栏序列号 let textMetrics = getMeasureText(r+1, luckysheetTableContent); //luckysheetTableContent.measureText(r + 1); @@ -95,7 +97,23 @@ function luckysheetDrawgridRowTitle(scrollHeight, drawHeight, offsetTop) { luckysheetTableContent.fillText(r + 1, horizonAlignPos, verticalAlignPos); } - //行标题栏横线 + //vertical + luckysheetTableContent.beginPath(); + luckysheetTableContent.moveTo( + (Store.rowHeaderWidth - 2 + 0.5) * Store.devicePixelRatio, + Store.devicePixelRatio * (start_r + offsetTop - 2) + ); + luckysheetTableContent.lineTo( + (Store.rowHeaderWidth - 2 + 0.5) * Store.devicePixelRatio, + Store.devicePixelRatio * (end_r + offsetTop - 2) + ); + luckysheetTableContent.lineWidth = Store.devicePixelRatio; + + luckysheetTableContent.strokeStyle = luckysheetdefaultstyle.strokeStyle; + luckysheetTableContent.stroke(); + luckysheetTableContent.closePath(); + + //行标题栏横线,horizen luckysheetTableContent.beginPath(); luckysheetTableContent.moveTo( -1, @@ -105,30 +123,32 @@ function luckysheetDrawgridRowTitle(scrollHeight, drawHeight, offsetTop) { (Store.rowHeaderWidth - 1) * Store.devicePixelRatio, (end_r + offsetTop - 2 + 0.5) * Store.devicePixelRatio ); - luckysheetTableContent.lineWidth = Store.devicePixelRatio; - luckysheetTableContent.strokeStyle = luckysheetdefaultstyle.strokeStyle; + // luckysheetTableContent.lineWidth = Store.devicePixelRatio; + // luckysheetTableContent.strokeStyle = luckysheetdefaultstyle.strokeStyle; luckysheetTableContent.closePath(); luckysheetTableContent.stroke(); } //行标题栏竖线 - luckysheetTableContent.beginPath(); - luckysheetTableContent.moveTo( - (Store.rowHeaderWidth - 2 + 0.5) * Store.devicePixelRatio, - (offsetTop - 1) * Store.devicePixelRatio - ); - luckysheetTableContent.lineTo( - (Store.rowHeaderWidth - 2 + 0.5) * Store.devicePixelRatio, - (Store.rh_height + offsetTop) * Store.devicePixelRatio - ); - luckysheetTableContent.lineWidth = Store.devicePixelRatio; - luckysheetTableContent.strokeStyle = luckysheetdefaultstyle.strokeStyle; - luckysheetTableContent.closePath(); - luckysheetTableContent.stroke(); + // luckysheetTableContent.beginPath(); + // luckysheetTableContent.moveTo( + // (Store.rowHeaderWidth - 2 + 0.5) * Store.devicePixelRatio, + // (offsetTop - 1) * Store.devicePixelRatio + // ); + // luckysheetTableContent.lineTo( + // (Store.rowHeaderWidth - 2 + 0.5) * Store.devicePixelRatio, + // (Store.rh_height + offsetTop) * Store.devicePixelRatio + // ); + // luckysheetTableContent.lineWidth = Store.devicePixelRatio; + // luckysheetTableContent.strokeStyle = luckysheetdefaultstyle.strokeStyle; + // luckysheetTableContent.closePath(); + // luckysheetTableContent.stroke(); //清除canvas左上角区域 防止列标题栏序列号溢出显示 - luckysheetTableContent.clearRect(0, 0, Store.rowHeaderWidth * Store.devicePixelRatio, Store.columeHeaderHeight * Store.devicePixelRatio); + // luckysheetTableContent.clearRect(0, 0, Store.rowHeaderWidth * Store.devicePixelRatio, Store.columeHeaderHeight * Store.devicePixelRatio); + + luckysheetTableContent.restore(); } function luckysheetDrawgridColumnTitle(scrollWidth, drawWidth, offsetLeft) { @@ -167,6 +187,11 @@ function luckysheetDrawgridColumnTitle(scrollWidth, drawWidth, offsetLeft) { if (dataset_col_ed == -1) { dataset_col_ed = Store.visibledatacolumn.length - 1; } + + luckysheetTableContent.save(); + luckysheetTableContent.beginPath(); + luckysheetTableContent.rect(offsetLeft* Store.devicePixelRatio, 0, drawWidth, Store.columeHeaderHeight * Store.devicePixelRatio-1); + luckysheetTableContent.clip(); let end_c, start_c; @@ -184,6 +209,15 @@ function luckysheetDrawgridColumnTitle(scrollWidth, drawWidth, offsetLeft) { break; } + luckysheetTableContent.fillStyle = "#ffffff"; + luckysheetTableContent.fillRect( + (start_c + offsetLeft - 1) * Store.devicePixelRatio, + 0, + (end_c - start_c) * Store.devicePixelRatio, + Store.columeHeaderHeight * Store.devicePixelRatio-1 + ) + luckysheetTableContent.fillStyle = "#000000"; + //列标题栏序列号 let abc = chatatABC(c); let textMetrics = getMeasureText(abc, luckysheetTableContent); @@ -194,7 +228,7 @@ function luckysheetDrawgridColumnTitle(scrollWidth, drawWidth, offsetLeft) { luckysheetTableContent.fillText(abc, horizonAlignPos, verticalAlignPos); - //列标题栏竖线 + //列标题栏竖线 vertical luckysheetTableContent.beginPath(); luckysheetTableContent.moveTo( (end_c + offsetLeft - 2 + 0.5) * Store.devicePixelRatio, @@ -208,25 +242,43 @@ function luckysheetDrawgridColumnTitle(scrollWidth, drawWidth, offsetLeft) { luckysheetTableContent.strokeStyle = luckysheetdefaultstyle.strokeStyle; luckysheetTableContent.closePath(); luckysheetTableContent.stroke(); + + //horizen + luckysheetTableContent.beginPath(); + luckysheetTableContent.moveTo( + Store.devicePixelRatio * (start_c + offsetLeft - 1), + (Store.columeHeaderHeight - 2 + 0.5) * Store.devicePixelRatio + ); + luckysheetTableContent.lineTo( + Store.devicePixelRatio * (end_c + offsetLeft - 1), + (Store.columeHeaderHeight - 2 + 0.5) * Store.devicePixelRatio + ); + // luckysheetTableContent.lineWidth = Store.devicePixelRatio; + + // luckysheetTableContent.strokeStyle = luckysheetdefaultstyle.strokeStyle; + luckysheetTableContent.stroke(); + luckysheetTableContent.closePath(); } //列标题栏横线 - luckysheetTableContent.beginPath(); - luckysheetTableContent.moveTo( - (offsetLeft - 1) * Store.devicePixelRatio, - (Store.columeHeaderHeight - 2 + 0.5) * Store.devicePixelRatio - ); - luckysheetTableContent.lineTo( - (Store.ch_width + offsetLeft - 2) * Store.devicePixelRatio, - (Store.columeHeaderHeight - 2 + 0.5) * Store.devicePixelRatio - ); - luckysheetTableContent.lineWidth = Store.devicePixelRatio; - luckysheetTableContent.strokeStyle = luckysheetdefaultstyle.strokeStyle; - luckysheetTableContent.closePath(); - luckysheetTableContent.stroke(); + // luckysheetTableContent.beginPath(); + // luckysheetTableContent.moveTo( + // (offsetLeft - 1) * Store.devicePixelRatio, + // (Store.columeHeaderHeight - 2 + 0.5) * Store.devicePixelRatio + // ); + // luckysheetTableContent.lineTo( + // (Store.ch_width + offsetLeft - 2) * Store.devicePixelRatio, + // (Store.columeHeaderHeight - 2 + 0.5) * Store.devicePixelRatio + // ); + // luckysheetTableContent.lineWidth = Store.devicePixelRatio; + // luckysheetTableContent.strokeStyle = luckysheetdefaultstyle.strokeStyle; + // luckysheetTableContent.closePath(); + // luckysheetTableContent.stroke(); //清除canvas左上角区域 防止列标题栏序列号溢出显示 - luckysheetTableContent.clearRect(0, 0, Store.rowHeaderWidth * Store.devicePixelRatio, Store.columeHeaderHeight * Store.devicePixelRatio); + // luckysheetTableContent.clearRect(0, 0, Store.rowHeaderWidth * Store.devicePixelRatio, Store.columeHeaderHeight * Store.devicePixelRatio); + + luckysheetTableContent.restore(); } function luckysheetDrawMain(scrollWidth, scrollHeight, drawWidth, drawHeight, offsetLeft, offsetTop, columnOffsetCell, rowOffsetCell, mycanvas) { @@ -2057,7 +2109,6 @@ function cellOverflow_colIn(map, r, c, col_st, col_ed){ } export { - luckysheetDrawgrid, luckysheetDrawgridRowTitle, luckysheetDrawgridColumnTitle, luckysheetDrawMain, diff --git a/src/global/refresh.js b/src/global/refresh.js index 345552e..c76cd3f 100644 --- a/src/global/refresh.js +++ b/src/global/refresh.js @@ -4,7 +4,6 @@ import editor from './editor'; import { setcellvalue } from './setdata'; import { computeRowlenArr } from './getRowlen'; import { - luckysheetDrawgrid, luckysheetDrawMain, luckysheetDrawgridRowTitle, luckysheetDrawgridColumnTitle @@ -875,19 +874,20 @@ function luckysheetrefreshgrid(scrollWidth, scrollHeight) { ); //标题 + luckysheetDrawgridColumnTitle(freezen_vertical_scrollTop, freezen_vertical_px, Store.rowHeaderWidth); luckysheetDrawgridColumnTitle( scrollWidth + freezen_vertical_px - freezen_vertical_scrollTop, drawWidth - freezen_vertical_px + freezen_vertical_scrollTop, freezen_vertical_px - freezen_vertical_scrollTop + Store.rowHeaderWidth ); - luckysheetDrawgridColumnTitle(freezen_vertical_scrollTop, freezen_vertical_px, Store.rowHeaderWidth); + luckysheetDrawgridRowTitle(freezen_horizon_scrollTop, freezen_horizon_px, Store.columeHeaderHeight); luckysheetDrawgridRowTitle( scrollHeight + freezen_horizon_px - freezen_horizon_scrollTop, drawHeight - freezen_horizon_px + freezen_horizon_scrollTop, freezen_horizon_px - freezen_horizon_scrollTop + Store.columeHeaderHeight ); - luckysheetDrawgridRowTitle(freezen_horizon_scrollTop, freezen_horizon_px, Store.columeHeaderHeight); + } else if (luckysheetFreezen.freezenhorizontaldata != null) { freezen_horizon_px = luckysheetFreezen.freezenhorizontaldata[0]; @@ -916,12 +916,13 @@ function luckysheetrefreshgrid(scrollWidth, scrollHeight) { luckysheetDrawgridColumnTitle(scrollWidth, drawWidth, null); + luckysheetDrawgridRowTitle(freezen_horizon_scrollTop, freezen_horizon_px, Store.columeHeaderHeight); luckysheetDrawgridRowTitle( scrollHeight + freezen_horizon_px - freezen_horizon_scrollTop, drawHeight - freezen_horizon_px + freezen_horizon_scrollTop, freezen_horizon_px - freezen_horizon_scrollTop + Store.columeHeaderHeight ); - luckysheetDrawgridRowTitle(freezen_horizon_scrollTop, freezen_horizon_px, Store.columeHeaderHeight); + } else if (luckysheetFreezen.freezenverticaldata != null) { freezen_vertical_px = luckysheetFreezen.freezenverticaldata[0]; @@ -950,16 +951,26 @@ function luckysheetrefreshgrid(scrollWidth, scrollHeight) { luckysheetDrawgridRowTitle(scrollHeight, drawHeight, null); + luckysheetDrawgridColumnTitle(freezen_vertical_scrollTop, freezen_vertical_px, Store.rowHeaderWidth); luckysheetDrawgridColumnTitle( scrollWidth + freezen_vertical_px - freezen_vertical_scrollTop, drawWidth - freezen_vertical_px + freezen_vertical_scrollTop, freezen_vertical_px - freezen_vertical_scrollTop + Store.rowHeaderWidth ); - luckysheetDrawgridColumnTitle(freezen_vertical_scrollTop, freezen_vertical_px, Store.rowHeaderWidth); + } } else { - luckysheetDrawgrid(scrollWidth, scrollHeight); + if($("#luckysheetTableContent").length == 0){ + return; + } + + luckysheetDrawMain(scrollWidth, scrollHeight); + + $("#luckysheetTableContent").get(0).getContext("2d").clearRect(0, 0, 46, 20); + + luckysheetDrawgridColumnTitle(scrollWidth); + luckysheetDrawgridRowTitle(scrollHeight); } } diff --git a/src/global/scroll.js b/src/global/scroll.js index ad8a24f..f2a5d1e 100644 --- a/src/global/scroll.js +++ b/src/global/scroll.js @@ -100,7 +100,7 @@ export default function luckysheetscrollevent(isadjust) { luckysheetrefreshgrid(scrollLeft, scrollTop); - $("#luckysheet-bottom-controll-row").css("left", scrollLeft + 10); + $("#luckysheet-bottom-controll-row").css("left", scrollLeft); //有选区且有冻结时,滚动适应 if(luckysheetFreezen.freezenhorizontaldata != null || luckysheetFreezen.freezenverticaldata != null){