Skip to content

Commit

Permalink
Feature delete types, options, tickets and orders (#110)
Browse files Browse the repository at this point in the history 
* Update packafe.json and run the site

* Make a delete button (only button, it does the change buy-able atm)

* Adding a delete function to delete a type

* Update options for tickets

Add a delete (working) delete function, redesign it that it works the same as the types.

* Fix "Add ticket option to type"

Removed some lines that were necessarily to add options to ticket types

* Update Tickets more like Tickets/types and Tickets/options

* Add deleting an order

* Delete a Ticket

* Adding delete an Order

* Update lancie-dialog dependency errors

* Update all style based on Martijn Feedback

* Add refreshing the page after deletion
  • Loading branch information
@ArdyZ
ArdyZ authored Dec 22, 2021
1 parent d1b71c2 commit 41883df
Show file tree
Hide file tree
Showing 5 changed files with 217 additions and 70 deletions.
3 changes: 3 additions & 0 deletions src/lancie-admin-endpoint/lancie-admin-page-layout.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -26,6 +26,9 @@
<div class="card-content">
<slot></slot>
</div>
<div class="card-actions">
<slot name="card-actions"></slot>
</div>
</paper-card>

</template>
Expand Down
65 changes: 60 additions & 5 deletions src/lancie-admin-endpoint/lancie-admin-pages/lancie-admin-orders.html
View file
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
<link rel="import" href="../../../bower_components/polymer/polymer.html">
<link rel="import" href="../../../bower_components/lancie-ajax/lancie-ajax.html">

<link rel="import" href="../../../bower_components/lancie-dialog/lancie-dialog.html">
<link rel="import" href="../lancie-admin-page-layout.html">
<link rel="import" href="../../lancie-admin-table/lancie-admin-table.html">

Expand All @@ -15,13 +15,37 @@
<lancie-ajax auto-fire id="endpointAjax" refurl="orders" on-lancie-ajax="onResponse">
</lancie-ajax>

<lancie-admin-page-layout endpoint="orders">
<p>Here is where the orders will be.</p>
<p>Requests will be on <code>/api/v1/orders</code></p>
<lancie-ajax id="ajaxDeleteTicket" method="DELETE" body="" refurl="orders/[[selectedId]]" on-response="onDeleteOrderResponse"></lancie-ajax>></lancie-ajax>

<lancie-admin-page-layout heading="Orders">
<div>
<p>Here is where the orders will be.</p>
<p>Requests will be on <code>/api/v1/orders</code></p>

<lancie-admin-table id="table" column-mappings="[[mappings]]" column-renderers="[[renderers]]"></lancie-admin-table>
<lancie-admin-table id="table" column-mappings="[[mappings]]" column-renderers="[[renderers]]"></lancie-admin-table>
</div>
<div slot="card-actions">
<lancie-error id="noTypeSelectedError"></lancie-error>
<!-- <paper-button on-tap="openAddTypeDialog">Add Ticket</paper-button> -->
<paper-button on-tap="openDeleteOrderDialog">Delete</paper-button>
</div>
</lancie-admin-page-layout>

<lancie-dialog id="deleteOrderDialog">
<h2>Delete Order</h2>
<div class="dialog-content">
<h4>Delete the following Orders (cannot be undone!):</h4>
<template id="typeSelected" is="dom-repeat" items="[[selectedTypes]]">
<p>[[item.id]]</p>
</template>
</div>

<div class="dialog-actions">
<paper-button dialog-dismiss>Cancel</paper-button>
<paper-button on-tap="tryDeleteOrders">Confirm</paper-button>
</div>
</lancie-dialog>

</template>
<script>
(function () {
Expand Down Expand Up @@ -59,6 +83,37 @@
this.$.table.setData(request.response);
}
},

openDeleteOrderDialog: function() {
if (!this.$.table.selected().length > 0) {
this.$.noTypeSelectedError.setError('Please select a type first.');
return;
}
this.selectedTypes = this.$.table.selected();
this.$.noTypeSelectedError.clear();
this.$.typeSelected.render();
this.$.deleteOrderDialog.open();
},

tryDeleteOrders: function() {
this.selectedTypes.forEach(t => this.tryDeleteOrder(t))
this.$.table.clearSelection();
this.$.deleteOrderDialog.close();
this.$.getTypeAjax.generateRequest();
},

tryDeleteOrder: function(t) {
this.selectedId = t.id;
this.$.ajaxDeleteTicket.generateRequest();
},

onDeleteOrderResponse: function(e, request) {
if (!request.succeeded) {
this.$.addDialogError.setError("Could not delete ticket. Please refresh and try again.");
return;
}
this.$.endpointAjax.generateRequest();
},
});
})();
</script>
Expand Down
65 changes: 60 additions & 5 deletions src/lancie-admin-endpoint/lancie-admin-pages/lancie-admin-tickets.html
View file
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
<link rel="import" href="../../../bower_components/polymer/polymer.html">
<link rel="import" href="../../../bower_components/lancie-ajax/lancie-ajax.html">

<link rel="import" href="../../../bower_components/lancie-dialog/lancie-dialog.html">
<link rel="import" href="../lancie-admin-page-layout.html">
<link rel="import" href="../../lancie-admin-table/lancie-admin-table.html">

Expand All @@ -15,13 +15,37 @@
<lancie-ajax auto-fire id="endpointAjax" refurl="tickets" on-lancie-ajax="onResponse">
</lancie-ajax>

<lancie-admin-page-layout endpoint="tickets">
<p>Here is where the [[endpoint]] will be.</p>
<p>Requests will be on <code>/api/v1/tickets</code></p>
<lancie-ajax id="ajaxDeleteTicket" method="DELETE" body="" refurl="tickets/[[selectedId]]" on-response="onDeleteTicketResponse"></lancie-ajax>

<lancie-admin-page-layout heading="Tickets">
<div></div>
<p>Here is where the tickets will be.</p>
<p>Requests will be on <code>/api/v1/tickets</code></p>

<lancie-admin-table id="table" column-mappings="[[mappings]]" column-renderers="[[renderers]]"></lancie-admin-table>
<lancie-admin-table id="table" column-mappings="[[mappings]]" column-renderers="[[renderers]]"></lancie-admin-table>
</div>
<div slot="card-actions">
<lancie-error id="noTypeSelectedError"></lancie-error>
<!-- <paper-button on-tap="openAddTypeDialog">Add Ticket</paper-button> -->
<paper-button on-tap="openDeleteTicketDialog">Delete</paper-button>
</div>
</lancie-admin-page-layout>

<lancie-dialog id="deleteTicketDialog">
<h2>Delete Ticket</h2>
<div class="dialog-content">
<h4>Delete the following Tickets (cannot be undone!):</h4>
<template id="typeSelected" is="dom-repeat" items="[[selectedTypes]]">
<p>[[item.id]]</p>
</template>
</div>

<div class="dialog-actions">
<paper-button dialog-dismiss>Cancel</paper-button>
<paper-button on-tap="tryDeleteTickets">Confirm</paper-button>
</div>
</lancie-dialog>

</template>
<script>
(function () {
Expand Down Expand Up @@ -61,6 +85,37 @@
this.$.table.setData(request.response);
}
},

openDeleteTicketDialog: function() {
if (!this.$.table.selected().length > 0) {
this.$.noTypeSelectedError.setError('Please select a type first.');
return;
}
this.selectedTypes = this.$.table.selected();
this.$.noTypeSelectedError.clear();
this.$.typeSelected.render();
this.$.deleteTicketDialog.open();
},

tryDeleteTickets: function() {
this.selectedTypes.forEach(t => this.tryDeleteTicket(t))
this.$.table.clearSelection();
this.$.deleteTicketDialog.close();
// this.$.getTypeAjax.generateRequest();
},

tryDeleteTicket: function(t) {
this.selectedId = t.id;
this.$.ajaxDeleteTicket.generateRequest();
},

onDeleteTicketResponse: function(e, request) {
if (!request.succeeded) {
this.$.addDialogError.setError("Could not delete ticket. Please refresh and try again.");
return;
}
this.$.endpointAjax.generateRequest();
},
});
})();
</script>
Expand Down
77 changes: 40 additions & 37 deletions ...cie-admin-endpoint/lancie-admin-pages/lancie-admin-types/lancie-admin-ticket-options.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -20,43 +20,29 @@
:host {
display: block;
}

paper-card {
width: calc(100% - 32px);
margin: 16px;
}

[hidden] {
display: none !important;
}

@media (max-width: 640px) {
paper-card {
width: 100%;
margin: 0;
}
}
</style>

<lancie-ajax auto-fire id="getOptionAjax" refurl="tickets/options" on-lancie-ajax="onOptionResponse"></lancie-ajax>

<lancie-ajax id="ajaxDeleteTicketOption" method="DELETE" refurl="tickets/options/[[deleteOption.id]]" on-lancie-ajax="onDeleteResponse"></lancie-ajax>
<lancie-ajax id="ajaxDeleteTicketOption" method="DELETE" refurl="tickets/options/[[selectedId]]" on-lancie-ajax="onDeleteResponse"></lancie-ajax>

<paper-card heading="Ticket Options">
<div class="card-content" on-delete-ticket-option-dialog="deleteTicketOptionDialog">
<lancie-error id="optionError"></lancie-error>
<template is="dom-repeat" items="[[options]]">
<lancie-admin-ticket-option option="[[item]]"></lancie-admin-ticket-option>
</template>
<lancie-admin-page-layout heading="Ticket Options">
<div>
<p>Here is where the options will be.</p>
<p>Requests will be on <code>/api/v1/tickets/options</code></p>
<lancie-admin-table id="table" column-mappings="[[mappings]]" column-renderers="[[renderers]]"></lancie-admin-table>
</div>
<div class="card-actions">
<div slot="card-actions">
<lancie-error id="noOptionSelectedError"></lancie-error>
<paper-button on-tap="openAddOptionDialog">Add Ticket Option</paper-button>
</div>
<paper-button on-tap="openDeleteOptionDialog">Delete Ticket Option</paper-button>
</div>
</paper-card>

<lancie-dialog id="addTicketOptionDialog">
<h2>Add Ticket Option</h2>
<div class="dialog-content">
<lancie-error id="addDialogError"></lancie-error>
<lancie-error id="addOptionDialogError"></lancie-error>
<lancie-form id="addTicketOptionForm" refurl="tickets/options" on-response="onAddOptionResponse">
<paper-input label="Name" name="name" error-message="This field is required!" auto-validate required></paper-input>
<paper-input label="Price" name="price" step=".01" type="number" error-message="This field is required!" auto-validate required></paper-input>
Expand All @@ -68,15 +54,17 @@ <h2>Add Ticket Option</h2>
</lancie-dialog>

<lancie-dialog id="deleteTicketOptionDialog">
<h2>Confirm deletion</h2>
<h2>Delete Option</h2>
<div class="dialog-content">
<lancie-error id="dialogError"></lancie-error>
<h4>Are you certain you want to delete this ticket option?</h4>
<p>[[deleteOption.name]]</p>
<h4>Deleting a Option can only be done when there are no more tickets with this Option. Delete the following Option (cannot be undone!):</h4>
<template id="typeSelected" is="dom-repeat" items="[[selectedTypes]]">
<p>[[item.name]]</p>
</template>
</div>

<div class="dialog-actions">
<paper-button dialog-dismiss>Cancel</paper-button>
<paper-button on-tap="tryDeleteOption" class="confirm-delete-button">Delete</paper-button>
<paper-button on-tap="tryDeleteOptions" class="confirm-delete-button">Delete</paper-button>
</div>
</lancie-dialog>
</template>
Expand Down Expand Up @@ -127,17 +115,30 @@ <h4>Are you certain you want to delete this ticket option?</h4>
}

this.$.addTicketOptionDialog.close();
this.$.getOptionAjax.generateRequest();
this.$.getOptionAjax.generateRequest();
},

deleteTicketOptionDialog: function(event) {
this.deleteOption = this.options.find(option => {
return option.id === event.detail.id;
});
openDeleteOptionDialog: function() {
if (!this.$.table.selected().length > 0) {
this.$.noOptionSelectedError.setError('Please select a option first.');
return;
}
this.selectedTypes = this.$.table.selected();
this.$.noOptionSelectedError.clear();
this.$.typeSelected.render();
this.$.deleteTicketOptionDialog.open();
},

tryDeleteOption: function() {
tryDeleteOptions: function() {
this.selectedTypes.forEach(t => this.tryDeleteOption(t))
this.$.table.clearSelection();
this.$.deleteTicketOptionDialog.close();
this.$.getTypeAjax.generateRequest();
},

tryDeleteOption: function(t) {
this.selectedType = t;
this.selectedId = t.id;
this.$.ajaxDeleteTicketOption.generateRequest();
},

Expand All @@ -157,8 +158,10 @@ <h4>Are you certain you want to delete this ticket option?</h4>
return;
}

this.$.table.setData(request.response);
this.fire('set-options', {'options': request.response});
this.options = request.response;

}
});
})();
Expand Down
Loading

0 comments on commit 41883df

Please sign in to comment.