forked from tsai/budibase
Martin McKeaveney
6 years ago
14 changed files with 295 additions and 104 deletions
@ -1,42 +1,41 @@ |
|||
xcontext('Create a Table', () => { |
|||
context('Create a Table', () => { |
|||
|
|||
before(() => { |
|||
cy.visit('localhost:4001/_builder') |
|||
// https://on.cypress.io/type
|
|||
cy.createApp('Table App', 'Table App Description') |
|||
}) |
|||
|
|||
// https://on.cypress.io/interacting-with-elements
|
|||
it('should create a new Table', () => { |
|||
|
|||
cy.createTable('dog', 'name', 'age') |
|||
cy.createTable('dog') |
|||
|
|||
// Check if Table exists
|
|||
cy.get('.title').should('have.text', 'dog') |
|||
}) |
|||
|
|||
it('adds a new column to the table', () => { |
|||
cy.addRecord('bob', '15') |
|||
// it('adds a new column to the table', () => {
|
|||
// cy.addRecord('bob', '15')
|
|||
|
|||
cy.contains('bob').should('have.text', 'bob') |
|||
}) |
|||
// cy.contains('bob').should('have.text', 'bob')
|
|||
// })
|
|||
|
|||
it('updates a column on the table', () => { |
|||
cy.addRecord('bob', '15') |
|||
// it('updates a column on the table', () => {
|
|||
// cy.addRecord('bob', '15')
|
|||
|
|||
cy.contains('bob').should('have.text', 'bob') |
|||
}) |
|||
// cy.contains('bob').should('have.text', 'bob')
|
|||
// })
|
|||
|
|||
it('edits a record', () => { |
|||
cy.addRecord('bob', '15') |
|||
// it('edits a record', () => {
|
|||
// cy.addRecord('bob', '15')
|
|||
|
|||
cy.contains('bob').should('have.text', 'bob') |
|||
}) |
|||
// cy.contains('bob').should('have.text', 'bob')
|
|||
// })
|
|||
|
|||
it('deletes a record', () => { |
|||
cy.addRecord('bob', '15') |
|||
// it('deletes a record', () => {
|
|||
// cy.addRecord('bob', '15')
|
|||
|
|||
cy.contains('bob').should('have.text', 'bob') |
|||
}) |
|||
// cy.contains('bob').should('have.text', 'bob')
|
|||
// })
|
|||
|
|||
}) |
|||
|
|||
@ -0,0 +1,64 @@ |
|||
<script> |
|||
import ActionButton from "components/common/ActionButton.svelte" |
|||
import { notifier } from "builderStore/store/notifications" |
|||
import { store, backendUiStore } from "builderStore" |
|||
import * as api from "../api" |
|||
|
|||
export let table |
|||
export let onClosed |
|||
|
|||
function deleteTable() { |
|||
backendUiStore.actions.models.delete(table) |
|||
} |
|||
</script> |
|||
|
|||
<section> |
|||
<div class="content"> |
|||
<heading> |
|||
<i class="ri-information-line alert" /> |
|||
<h4 class="budibase__title--4">Delete Table</h4> |
|||
</heading> |
|||
<p> |
|||
Are you sure you want to delete this table? All of your data will be |
|||
permanently removed. This action cannot be undone. |
|||
</p> |
|||
</div> |
|||
<div class="modal-actions"> |
|||
<ActionButton on:click={onClosed}>Cancel</ActionButton> |
|||
<ActionButton |
|||
alert |
|||
on:click={async () => { |
|||
await backendUiStore.actions.models.delete(table) |
|||
notifier.danger('Table deleted') |
|||
onClosed() |
|||
}}> |
|||
Delete |
|||
</ActionButton> |
|||
</div> |
|||
</section> |
|||
|
|||
<style> |
|||
.alert { |
|||
color: rgba(255, 0, 31, 1); |
|||
background: var(--grey-1); |
|||
padding: 5px; |
|||
} |
|||
|
|||
.modal-actions { |
|||
padding: 10px; |
|||
background: var(--grey-1); |
|||
border-top: 1px solid #ccc; |
|||
} |
|||
|
|||
heading { |
|||
display: flex; |
|||
align-items: center; |
|||
} |
|||
.content { |
|||
padding: 30px; |
|||
} |
|||
|
|||
h4 { |
|||
margin: 0 0 0 10px; |
|||
} |
|||
</style> |
|||
@ -0,0 +1,133 @@ |
|||
<script> |
|||
import { getContext } from "svelte" |
|||
import { backendUiStore } from "builderStore" |
|||
import { DropdownMenu, Button, Icon, Input, Select } from "@budibase/bbui" |
|||
import { FIELDS } from "constants/backend" |
|||
import DeleteTableModal from "components/database/ModelDataTable/modals/DeleteTable.svelte" |
|||
|
|||
const { open, close } = getContext("simple-modal") |
|||
|
|||
export let table |
|||
|
|||
let anchor |
|||
let dropdown |
|||
|
|||
let editing |
|||
|
|||
function showEditor() { |
|||
editing = true |
|||
} |
|||
|
|||
function hideEditor() { |
|||
dropdown.hide() |
|||
editing = false |
|||
close() |
|||
} |
|||
|
|||
const deleteTable = () => { |
|||
open( |
|||
DeleteTableModal, |
|||
{ |
|||
onClosed: close, |
|||
table, |
|||
}, |
|||
{ styleContent: { padding: "0" } } |
|||
) |
|||
} |
|||
|
|||
function save() {} |
|||
</script> |
|||
|
|||
<div bind:this={anchor} on:click={dropdown.show}> |
|||
<i class="ri-more-line" /> |
|||
</div> |
|||
<DropdownMenu bind:this={dropdown} {anchor} align="left"> |
|||
{#if editing} |
|||
<div class="container"> |
|||
<h4>Edit Table</h4> |
|||
<Input placeholder="Table Name" thin bind:value={table.name} /> |
|||
</div> |
|||
<footer> |
|||
<div class="button-margin-3"> |
|||
<Button secondary on:click={hideEditor}>Cancel</Button> |
|||
</div> |
|||
<div class="button-margin-4"> |
|||
<Button primary on:click={save}>Save</Button> |
|||
</div> |
|||
</footer> |
|||
{:else} |
|||
<ul> |
|||
<li on:click={showEditor}> |
|||
<Icon name="edit" /> |
|||
Edit |
|||
</li> |
|||
<li on:click={deleteTable}> |
|||
<Icon name="delete" /> |
|||
Delete |
|||
</li> |
|||
</ul> |
|||
{/if} |
|||
</DropdownMenu> |
|||
|
|||
<style> |
|||
h4 { |
|||
padding: var(--spacing-l); |
|||
margin: 0; |
|||
} |
|||
|
|||
ul { |
|||
list-style: none; |
|||
padding-left: 0; |
|||
margin: 0; |
|||
padding: var(--spacing-s) 0; |
|||
} |
|||
|
|||
li { |
|||
display: flex; |
|||
font-family: var(--font-sans); |
|||
font-size: var(--font-size-xs); |
|||
color: var(--ink); |
|||
padding: var(--spacing-s) var(--spacing-m); |
|||
margin: auto 0px; |
|||
align-items: center; |
|||
cursor: pointer; |
|||
} |
|||
|
|||
li:hover { |
|||
background-color: var(--grey-2); |
|||
} |
|||
|
|||
li:active { |
|||
color: var(--blue); |
|||
} |
|||
|
|||
.container { |
|||
padding: var(--spacing-l); |
|||
margin: 0; |
|||
} |
|||
|
|||
footer { |
|||
padding: 20px; |
|||
display: grid; |
|||
grid-template-columns: 1fr 1fr 1fr 1fr; |
|||
gap: 20px; |
|||
background: var(--grey-1); |
|||
border-bottom-left-radius: 0.5rem; |
|||
border-bottom-left-radius: 0.5rem; |
|||
} |
|||
|
|||
.button-margin-1 { |
|||
grid-column-start: 1; |
|||
display: grid; |
|||
} |
|||
|
|||
.button-margin-3 { |
|||
grid-column-start: 3; |
|||
display: grid; |
|||
} |
|||
|
|||
.button-margin-4 { |
|||
grid-column-start: 4; |
|||
display: grid; |
|||
} |
|||
</style> |
|||
Loading…
Reference in new issue