61 lines
1.5 KiB
Svelte
Executable File
61 lines
1.5 KiB
Svelte
Executable File
<script>
|
|
import { longpress } from '../libs/longpress.js';
|
|
import { slide } from 'svelte/transition';
|
|
import {state} from '../store/store.js';
|
|
|
|
export let item;
|
|
export let id;
|
|
let buttonsVisible = false;
|
|
let duration = 1000;
|
|
|
|
function deleteItem() {
|
|
console.log(`delete: ${id}`);
|
|
buttonsVisible = false;
|
|
state.deleteRoute(id);
|
|
}
|
|
|
|
function closeEditor() {
|
|
buttonsVisible = false
|
|
}
|
|
|
|
function saveEditor() {
|
|
|
|
}
|
|
|
|
</script>
|
|
|
|
<style>
|
|
.grid-3 {
|
|
display: grid;
|
|
grid-template-columns: repeat(3, 1fr);
|
|
grid-gap: 1rem;
|
|
}
|
|
</style>
|
|
|
|
<div out:slide|local>
|
|
<div class="grid card ">
|
|
<div class="col-5">{item.startStation.name}</div>
|
|
<div class="col-1"><i class="fa fa-thick-arrow fa-1x mui--align-middle"></i></div>
|
|
<div class="col-5">{item.destStation.name}</div>
|
|
<div class="col-1"><button class="btn btn-sm--slim" on:click="{() => buttonsVisible = !buttonsVisible}"><i class="fa fa-menu"></i></button></div>
|
|
|
|
|
|
</div>
|
|
|
|
{#if buttonsVisible}
|
|
<div class="my grid-3" transition:slide>
|
|
<button class="btn btn-danger btn-sm" id="delete" type="button" on:click={deleteItem}>
|
|
Delete
|
|
</button>
|
|
<button class="btn btn-primary btn-sm" id="save" type="button" on:click={saveEditor}>
|
|
Edit
|
|
</button>
|
|
|
|
<button class="btn btn-sm" type="button" on:click={closeEditor}>
|
|
Close
|
|
</button>
|
|
|
|
</div>
|
|
{/if}
|
|
</div>
|