Compare commits
No commits in common. "f4c6d6becc358e82af188419bc27009e295f0165" and "3cc2c73bc23f898803d0c1d9c4ee1b47324945f9" have entirely different histories.
f4c6d6becc
...
3cc2c73bc2
|
@ -1,3 +0,0 @@
|
||||||
<button id='item-edit-action' class='button is-warning'>Edit</button>
|
|
||||||
<button id='item-delete-action' class='button is-danger'>Delete</button>
|
|
||||||
<button id='item-close-action' class='button'>Close</button>
|
|
|
@ -1,38 +0,0 @@
|
||||||
<div class='field'>
|
|
||||||
<label class='label'>ean13</label>
|
|
||||||
<div class='control'>
|
|
||||||
<input
|
|
||||||
class='input input-number-wo-spinner'
|
|
||||||
type='number'
|
|
||||||
name='id'
|
|
||||||
value='{{ean13}}'
|
|
||||||
disabled
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class='field'>
|
|
||||||
<label class='label'>name</label>
|
|
||||||
<div class='control'>
|
|
||||||
<input class='input' type='text' name='name' value='{{name}}' />
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class='field'>
|
|
||||||
<label class='label'>notes</label>
|
|
||||||
<div class='control'>
|
|
||||||
<textarea id='notes' class='textarea'>{{notes}}</textarea>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class='field'>
|
|
||||||
<label class='label'>parent</label>
|
|
||||||
<div class='control'>
|
|
||||||
<input
|
|
||||||
class='input input-number-wo-spinner'
|
|
||||||
type='number'
|
|
||||||
name='parent'
|
|
||||||
value='{{parent.ean13}}'
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
|
@ -1,2 +0,0 @@
|
||||||
<button id='item-save-action' class='button is-success'>Save changes</button>
|
|
||||||
<button id='item-close-action' class='button'>Close</button>
|
|
|
@ -10,7 +10,7 @@
|
||||||
<section id='modal-body' class='modal-card-body'>
|
<section id='modal-body' class='modal-card-body'>
|
||||||
<!-- Content ... -->
|
<!-- Content ... -->
|
||||||
</section>
|
</section>
|
||||||
<footer id='modal-card-foot' class='modal-card-foot'>
|
<footer class='modal-card-foot'>
|
||||||
|
|
||||||
</footer>
|
</footer>
|
||||||
</div>
|
</div>
|
||||||
|
|
|
@ -1,12 +1,9 @@
|
||||||
import './style.scss';
|
import './style.scss';
|
||||||
import { EditItemInput, Item, Mutation, Query } from './generated/graphql';
|
import { Query } from './generated/graphql';
|
||||||
import root from './components/root.hbs';
|
import root from './components/root.hbs';
|
||||||
import loading from './components/loading.hbs';
|
import loading from './components/loading.hbs';
|
||||||
import itemList from './components/itemList.hbs';
|
import itemList from './components/itemList.hbs';
|
||||||
import itemDetails from './components/itemDetails.hbs';
|
import itemDetails from './components/itemDetails.hbs';
|
||||||
import itemDetailsActions from './components/itemDetailsActions.hbs';
|
|
||||||
import itemEdit from './components/itemEdit.hbs';
|
|
||||||
import itemEditActions from './components/itemEditActions.hbs';
|
|
||||||
|
|
||||||
async function request<T = Query>(
|
async function request<T = Query>(
|
||||||
query: string,
|
query: string,
|
||||||
|
@ -95,8 +92,6 @@ async function showItemDetails(id: string) {
|
||||||
'Item details';
|
'Item details';
|
||||||
(document.querySelector('#modal-body') as HTMLDivElement).innerHTML =
|
(document.querySelector('#modal-body') as HTMLDivElement).innerHTML =
|
||||||
loading();
|
loading();
|
||||||
(document.querySelector('#modal-card-foot') as HTMLDivElement).innerHTML =
|
|
||||||
itemDetailsActions();
|
|
||||||
showModal(true);
|
showModal(true);
|
||||||
const loaded = await request(
|
const loaded = await request(
|
||||||
`
|
`
|
||||||
|
@ -133,59 +128,6 @@ async function showItemDetails(id: string) {
|
||||||
).forEach((butt) =>
|
).forEach((butt) =>
|
||||||
butt.addEventListener('click', () => showItemDetails(butt.dataset.id!)),
|
butt.addEventListener('click', () => showItemDetails(butt.dataset.id!)),
|
||||||
);
|
);
|
||||||
(
|
|
||||||
document.querySelector('#item-edit-action') as HTMLButtonElement
|
|
||||||
).addEventListener('click', () => showItemEdit(loaded.item!));
|
|
||||||
(
|
|
||||||
document.querySelector('#item-close-action') as HTMLButtonElement
|
|
||||||
).addEventListener('click', () => showModal(false));
|
|
||||||
}
|
|
||||||
|
|
||||||
async function showItemEdit(item: Item) {
|
|
||||||
(document.querySelector('#modal-title') as HTMLParagraphElement).innerHTML =
|
|
||||||
'Item editing';
|
|
||||||
(document.querySelector('#modal-card-foot') as HTMLDivElement).innerHTML =
|
|
||||||
itemEditActions();
|
|
||||||
if (!item.parent && item.ancestors) {
|
|
||||||
item.parent = item.ancestors[item.ancestors.length - 1];
|
|
||||||
}
|
|
||||||
(document.querySelector('#modal-body') as HTMLDivElement).innerHTML =
|
|
||||||
itemEdit(item);
|
|
||||||
(
|
|
||||||
document.querySelector('#item-save-action') as HTMLButtonElement
|
|
||||||
).addEventListener('click', () => saveItemEdits());
|
|
||||||
(
|
|
||||||
document.querySelector('#item-close-action') as HTMLButtonElement
|
|
||||||
).addEventListener('click', () => showModal(false));
|
|
||||||
}
|
|
||||||
|
|
||||||
async function saveItemEdits() {
|
|
||||||
function getInput(name: string) {
|
|
||||||
return (document.querySelector(`input[name="${name}"]`) as HTMLInputElement)
|
|
||||||
.value;
|
|
||||||
}
|
|
||||||
const input: EditItemInput = {
|
|
||||||
id: getInput('id'),
|
|
||||||
name: getInput('name'),
|
|
||||||
notes:
|
|
||||||
(document.querySelector('#notes') as HTMLTextAreaElement).value || null,
|
|
||||||
parent: getInput('parent'),
|
|
||||||
};
|
|
||||||
(document.querySelector('#modal-body') as HTMLDivElement).innerHTML =
|
|
||||||
loading();
|
|
||||||
await request<Mutation>(
|
|
||||||
`
|
|
||||||
mutation ($input: EditItemInput!) {
|
|
||||||
editItem(input: $input) {
|
|
||||||
id
|
|
||||||
}
|
|
||||||
}
|
|
||||||
`,
|
|
||||||
{
|
|
||||||
input,
|
|
||||||
},
|
|
||||||
);
|
|
||||||
showItemDetails(input.id);
|
|
||||||
}
|
}
|
||||||
|
|
||||||
window.addEventListener('load', () => {
|
window.addEventListener('load', () => {
|
||||||
|
|
|
@ -1,11 +1,2 @@
|
||||||
$family-sans-serif: sans-serif;
|
$family-sans-serif: sans-serif;
|
||||||
@import '~bulma/bulma';
|
@import '~bulma/bulma';
|
||||||
|
|
||||||
.input-number-wo-spinner::-webkit-outer-spin-button,
|
|
||||||
.input-number-wo-spinner::-webkit-inner-spin-button {
|
|
||||||
-webkit-appearance: none;
|
|
||||||
margin: 0;
|
|
||||||
}
|
|
||||||
.input-number-wo-spinner {
|
|
||||||
-moz-appearance: textfield;
|
|
||||||
}
|
|
||||||
|
|
|
@ -65,7 +65,6 @@ export class ItemsService {
|
||||||
|
|
||||||
async getItemList(cursor: number = 0): Promise<PaginatedItems> {
|
async getItemList(cursor: number = 0): Promise<PaginatedItems> {
|
||||||
const [items, count] = await this.itemRepository.findAndCount({
|
const [items, count] = await this.itemRepository.findAndCount({
|
||||||
order: { id: 'ASC' },
|
|
||||||
take: 25,
|
take: 25,
|
||||||
skip: cursor,
|
skip: cursor,
|
||||||
});
|
});
|
||||||
|
|
Loading…
Reference in a new issue