Add double click to edit columns in grids
This commit is contained in:
parent
de13f4ea11
commit
4ede31acf6
4 changed files with 16 additions and 9 deletions
|
@ -88,7 +88,6 @@ export { default as ListItem } from "./List/ListItem.svelte"
|
|||
export { default as IconSideNav } from "./IconSideNav/IconSideNav.svelte"
|
||||
export { default as IconSideNavItem } from "./IconSideNav/IconSideNavItem.svelte"
|
||||
export { default as Accordion } from "./Accordion/Accordion.svelte"
|
||||
export { default as OptionSelectDnD } from "./OptionSelectDnD/OptionSelectDnD.svelte"
|
||||
export { default as AbsTooltip } from "./Tooltip/AbsTooltip.svelte"
|
||||
export { TooltipPosition, TooltipType } from "./Tooltip/AbsTooltip.svelte"
|
||||
|
||||
|
|
|
@ -9,7 +9,6 @@
|
|||
DatePicker,
|
||||
Modal,
|
||||
notifications,
|
||||
OptionSelectDnD,
|
||||
Layout,
|
||||
AbsTooltip,
|
||||
ProgressCircle,
|
||||
|
@ -42,6 +41,7 @@
|
|||
import RelationshipSelector from "components/common/RelationshipSelector.svelte"
|
||||
import { RowUtils } from "@budibase/frontend-core"
|
||||
import ServerBindingPanel from "components/common/bindings/ServerBindingPanel.svelte"
|
||||
import OptionsEditor from "./OptionsEditor.svelte"
|
||||
|
||||
const AUTO_TYPE = FieldType.AUTO
|
||||
const FORMULA_TYPE = FieldType.FORMULA
|
||||
|
@ -558,7 +558,7 @@
|
|||
bind:value={editableColumn.constraints.length.maximum}
|
||||
/>
|
||||
{:else if editableColumn.type === FieldType.OPTIONS}
|
||||
<OptionSelectDnD
|
||||
<OptionsEditor
|
||||
bind:constraints={editableColumn.constraints}
|
||||
bind:optionColors={editableColumn.optionColors}
|
||||
/>
|
||||
|
@ -581,7 +581,7 @@
|
|||
/>
|
||||
</div>
|
||||
{:else if editableColumn.type === FieldType.ARRAY}
|
||||
<OptionSelectDnD
|
||||
<OptionsEditor
|
||||
bind:constraints={editableColumn.constraints}
|
||||
bind:optionColors={editableColumn.optionColors}
|
||||
/>
|
||||
|
|
|
@ -1,15 +1,14 @@
|
|||
<script>
|
||||
import { flip } from "svelte/animate"
|
||||
import { dndzone } from "svelte-dnd-action"
|
||||
import Icon from "../Icon/Icon.svelte"
|
||||
import Popover from "../Popover/Popover.svelte"
|
||||
import { Icon, Popover } from "@budibase/bbui"
|
||||
import { onMount } from "svelte"
|
||||
|
||||
const flipDurationMs = 150
|
||||
|
||||
export let constraints
|
||||
export let optionColors = {}
|
||||
|
||||
const flipDurationMs = 150
|
||||
|
||||
let options = []
|
||||
let colorPopovers = []
|
||||
let anchors = []
|
|
@ -236,6 +236,14 @@
|
|||
}
|
||||
const debouncedUpdateFilter = debounce(updateFilter, 250)
|
||||
|
||||
const handleDoubleClick = () => {
|
||||
if (!$config.canEditColumns || column.schema.disabled || searching) {
|
||||
return
|
||||
}
|
||||
open = true
|
||||
editColumn()
|
||||
}
|
||||
|
||||
onMount(() => subscribe("close-edit-column", close))
|
||||
</script>
|
||||
|
||||
|
@ -254,6 +262,7 @@
|
|||
bind:this={anchor}
|
||||
class:disabled={$isReordering || $isResizing}
|
||||
class:sticky={idx === "sticky"}
|
||||
on:dblclick={handleDoubleClick}
|
||||
>
|
||||
<GridCell
|
||||
on:mousedown={onMouseDown}
|
||||
|
@ -316,7 +325,7 @@
|
|||
{#if open}
|
||||
<GridPopover
|
||||
{anchor}
|
||||
align="right"
|
||||
align="left"
|
||||
on:close={close}
|
||||
maxHeight={null}
|
||||
resizable
|
||||
|
|
Loading…
Reference in a new issue