Fix issue with dates and blur grids when interacting with header cells
This commit is contained in:
parent
8ac58fc0e7
commit
55014e304e
|
@ -179,6 +179,11 @@ export const stringifyDate = (
|
||||||
const day = `${value.date()}`.padStart(2, "0")
|
const day = `${value.date()}`.padStart(2, "0")
|
||||||
return `${year}-${month}-${day}T00:00:00.000`
|
return `${year}-${month}-${day}T00:00:00.000`
|
||||||
}
|
}
|
||||||
|
|
||||||
|
// Otherwise use a normal ISO string with time and timezone
|
||||||
|
else {
|
||||||
|
return value.toISOString()
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
// Formats a dayjs date according to schema flags
|
// Formats a dayjs date according to schema flags
|
||||||
|
|
|
@ -104,6 +104,7 @@
|
||||||
}
|
}
|
||||||
|
|
||||||
const onMouseDown = e => {
|
const onMouseDown = e => {
|
||||||
|
ui.actions.blur()
|
||||||
if ((e.touches?.length || e.button === 0) && orderable) {
|
if ((e.touches?.length || e.button === 0) && orderable) {
|
||||||
timeout = setTimeout(() => {
|
timeout = setTimeout(() => {
|
||||||
reorder.actions.startReordering(column.name, e)
|
reorder.actions.startReordering(column.name, e)
|
||||||
|
|
|
@ -3,10 +3,10 @@
|
||||||
import { Icon } from "@budibase/bbui"
|
import { Icon } from "@budibase/bbui"
|
||||||
import GridPopover from "../overlays/GridPopover.svelte"
|
import GridPopover from "../overlays/GridPopover.svelte"
|
||||||
|
|
||||||
const { visibleColumns, scroll, width, subscribe } = getContext("grid")
|
const { visibleColumns, scroll, width, subscribe, ui } = getContext("grid")
|
||||||
|
|
||||||
let anchor
|
let anchor
|
||||||
let open = false
|
let isOpen = false
|
||||||
|
|
||||||
$: columnsWidth = $visibleColumns.reduce(
|
$: columnsWidth = $visibleColumns.reduce(
|
||||||
(total, col) => (total += col.width),
|
(total, col) => (total += col.width),
|
||||||
|
@ -15,8 +15,13 @@
|
||||||
$: end = columnsWidth - 1 - $scroll.left
|
$: end = columnsWidth - 1 - $scroll.left
|
||||||
$: left = Math.min($width - 40, end)
|
$: left = Math.min($width - 40, end)
|
||||||
|
|
||||||
|
const open = () => {
|
||||||
|
ui.actions.blur()
|
||||||
|
isOpen = true
|
||||||
|
}
|
||||||
|
|
||||||
const close = () => {
|
const close = () => {
|
||||||
open = false
|
isOpen = false
|
||||||
}
|
}
|
||||||
|
|
||||||
onMount(() => subscribe("close-edit-column", close))
|
onMount(() => subscribe("close-edit-column", close))
|
||||||
|
@ -29,11 +34,11 @@
|
||||||
bind:this={anchor}
|
bind:this={anchor}
|
||||||
class="add"
|
class="add"
|
||||||
style="left:{left}px"
|
style="left:{left}px"
|
||||||
on:click={() => (open = true)}
|
on:click={open}
|
||||||
>
|
>
|
||||||
<Icon name="Add" />
|
<Icon name="Add" />
|
||||||
</div>
|
</div>
|
||||||
{#if open}
|
{#if isOpen}
|
||||||
<GridPopover
|
<GridPopover
|
||||||
{anchor}
|
{anchor}
|
||||||
align={$visibleColumns.length ? "right" : "left"}
|
align={$visibleColumns.length ? "right" : "left"}
|
||||||
|
|
|
@ -32,7 +32,6 @@ export const createActions = context => {
|
||||||
scroll,
|
scroll,
|
||||||
bounds,
|
bounds,
|
||||||
stickyColumn,
|
stickyColumn,
|
||||||
ui,
|
|
||||||
maxScrollLeft,
|
maxScrollLeft,
|
||||||
width,
|
width,
|
||||||
} = context
|
} = context
|
||||||
|
@ -45,7 +44,6 @@ export const createActions = context => {
|
||||||
const $visibleColumns = get(visibleColumns)
|
const $visibleColumns = get(visibleColumns)
|
||||||
const $bounds = get(bounds)
|
const $bounds = get(bounds)
|
||||||
const $stickyColumn = get(stickyColumn)
|
const $stickyColumn = get(stickyColumn)
|
||||||
ui.actions.blur()
|
|
||||||
|
|
||||||
// Generate new breakpoints for the current columns
|
// Generate new breakpoints for the current columns
|
||||||
let breakpoints = $visibleColumns.map(col => ({
|
let breakpoints = $visibleColumns.map(col => ({
|
||||||
|
|
Loading…
Reference in New Issue