bugfix: modal getting stuck on open (but hidden)
Recreate: Add Datatable component (from) index... try adding new screen... screen dialog does not show
This commit is contained in:
parent
3015512ae0
commit
3a319fbc7c
|
@ -12,14 +12,16 @@
|
||||||
export let onCancel = () => {}
|
export let onCancel = () => {}
|
||||||
|
|
||||||
export const show = () => {
|
export const show = () => {
|
||||||
UIkit.modal(theModal).show()
|
uiKitModal.hide()
|
||||||
|
uiKitModal.show()
|
||||||
}
|
}
|
||||||
|
|
||||||
export const hide = () => {
|
export const hide = () => {
|
||||||
UIkit.modal(theModal).hide()
|
uiKitModal.hide()
|
||||||
}
|
}
|
||||||
|
|
||||||
let theModal
|
let theModal
|
||||||
|
$: uiKitModal = theModal && UIkit.modal(theModal)
|
||||||
|
|
||||||
const cancel = () => {
|
const cancel = () => {
|
||||||
hide()
|
hide()
|
||||||
|
@ -32,7 +34,7 @@
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<div id="my-id" uk-modal bind:this={theModal}>
|
<div id={title} uk-modal bind:this={theModal}>
|
||||||
<div class="uk-modal-dialog">
|
<div class="uk-modal-dialog">
|
||||||
<button class="uk-modal-close-default" type="button" uk-close />
|
<button class="uk-modal-close-default" type="button" uk-close />
|
||||||
<div class="uk-modal-header">
|
<div class="uk-modal-header">
|
||||||
|
|
|
@ -5,6 +5,7 @@
|
||||||
import Button from "../common/Button.svelte"
|
import Button from "../common/Button.svelte"
|
||||||
import ActionButton from "../common/ActionButton.svelte"
|
import ActionButton from "../common/ActionButton.svelte"
|
||||||
import ButtonGroup from "../common/ButtonGroup.svelte"
|
import ButtonGroup from "../common/ButtonGroup.svelte"
|
||||||
|
import ConfirmDialog from "../common/ConfirmDialog.svelte"
|
||||||
import { pipe } from "../common/core"
|
import { pipe } from "../common/core"
|
||||||
import UIkit from "uikit"
|
import UIkit from "uikit"
|
||||||
import { isRootComponent } from "./pagesParsing/searchComponents"
|
import { isRootComponent } from "./pagesParsing/searchComponents"
|
||||||
|
@ -14,10 +15,10 @@
|
||||||
import { assign } from "lodash"
|
import { assign } from "lodash"
|
||||||
|
|
||||||
export const show = () => {
|
export const show = () => {
|
||||||
UIkit.modal(componentSelectorModal).show()
|
dialog.show()
|
||||||
}
|
}
|
||||||
|
|
||||||
let componentSelectorModal
|
let dialog
|
||||||
let layoutComponents
|
let layoutComponents
|
||||||
let layoutComponent
|
let layoutComponent
|
||||||
let screens
|
let screens
|
||||||
|
@ -50,11 +51,11 @@
|
||||||
if (!isValid) return
|
if (!isValid) return
|
||||||
|
|
||||||
store.createScreen(name, route, layoutComponent.name)
|
store.createScreen(name, route, layoutComponent.name)
|
||||||
UIkit.modal(componentSelectorModal).hide()
|
dialog.hide()
|
||||||
}
|
}
|
||||||
|
|
||||||
const cancel = () => {
|
const cancel = () => {
|
||||||
UIkit.modal(componentSelectorModal).hide()
|
dialog.hide()
|
||||||
}
|
}
|
||||||
|
|
||||||
const screenNameExists = name => {
|
const screenNameExists = name => {
|
||||||
|
@ -77,14 +78,14 @@
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<div bind:this={componentSelectorModal} id="new-component-modal" uk-modal>
|
<ConfirmDialog
|
||||||
<div class="uk-modal-dialog" uk-overflow-auto>
|
bind:this={dialog}
|
||||||
|
title="New Screen"
|
||||||
|
onCancel={cancel}
|
||||||
|
onOk={save}
|
||||||
|
okText="Create Screen">
|
||||||
|
|
||||||
<div class="uk-modal-header">
|
<div class="uk-form-horizontal">
|
||||||
<h1>New Screen</h1>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="uk-modal-body uk-form-horizontal">
|
|
||||||
<div class="uk-margin">
|
<div class="uk-margin">
|
||||||
<label class="uk-form-label">Name</label>
|
<label class="uk-form-label">Name</label>
|
||||||
<div class="uk-form-controls">
|
<div class="uk-form-controls">
|
||||||
|
@ -121,17 +122,7 @@
|
||||||
</select>
|
</select>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<ButtonGroup style="float: right;">
|
|
||||||
<ActionButton primary on:click={save}>Create Screen</ActionButton>
|
|
||||||
<ActionButton alert on:click={cancel}>Cancel</ActionButton>
|
|
||||||
</ButtonGroup>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<style>
|
</ConfirmDialog>
|
||||||
h1 {
|
|
||||||
font-size: 1.2em;
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
|
|
Loading…
Reference in New Issue