795 lines
49 KiB
HTML
795 lines
49 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en" dir="ltr">
|
|
<head>
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0" charset="utf-8" />
|
|
<title id="title"></title>
|
|
<link rel="icon" href="{{ url_for('static', filename='favicon.ico') }}">
|
|
|
|
<!-- Material Icons -->
|
|
<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet" />
|
|
<!-- Material Symbols - Outlined Set -->
|
|
<link href="https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined" rel="stylesheet" />
|
|
<!-- Material Symbols - Rounded Set -->
|
|
<link href="https://fonts.googleapis.com/css2?family=Material+Symbols+Rounded" rel="stylesheet" />
|
|
<!-- Material Symbols - Sharp Set -->
|
|
<link href="https://fonts.googleapis.com/css2?family=Material+Symbols+Sharp" rel="stylesheet" />
|
|
|
|
<link rel="stylesheet" href="{{ url_for('static', filename='css/uikit.min.css') }}"/>
|
|
<link rel="stylesheet" href="{{ url_for('static', filename='css/pantry.css') }}"/>
|
|
{% if session['user']['flags']['darkmode'] %}
|
|
<link id="dark-mode" rel="stylesheet" href="{{ url_for('static', filename='css/dark-mode.css') }}"/>
|
|
{% endif %}
|
|
|
|
<script src="{{ url_for('static', filename='js/uikit.min.js') }}"></script>
|
|
<script src="{{ url_for('static', filename='js/uikit-icons.min.js') }}"></script>
|
|
|
|
</head>
|
|
<style>
|
|
.add-button{
|
|
width: 100%;
|
|
border-radius: 10px;
|
|
margin-top: 10px;
|
|
background-color: transparent;
|
|
cursor: pointer;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
height: 40px;
|
|
}
|
|
.add-button:hover{
|
|
background-color: whitesmoke;
|
|
}
|
|
</style>
|
|
<style>
|
|
:root {
|
|
--primary-color: {{ session['user']['flags']['styles']['primary_color']}};
|
|
}
|
|
</style>
|
|
{% if session['user']['flags']['darkmode'] %}
|
|
<body class="uk-light">
|
|
{% else %}
|
|
<body>
|
|
{% endif %}
|
|
<nav class="uk-navbar-container">
|
|
<div class="uk-container uk-container-expand">
|
|
<div class="uk-navbar uk-navbar-primary">
|
|
<!-- Application Navigation-->
|
|
<div class="uk-navbar-left">
|
|
<ul class="uk-navbar-nav">
|
|
<li>
|
|
<a href>Apps</a>
|
|
<div class="uk-navbar-dropdown" uk-drop="mode: click; multi:false">
|
|
<ul class="uk-nav uk-navbar-dropdown-nav">
|
|
<li><a href="/planner">Planner</a></li>
|
|
<li><a href="/recipes">Recipes</a></li>
|
|
<li><a href="/shopping-lists">Shopping Lists</a></li>
|
|
<li class="uk-nav-header">Logistics</li>
|
|
<li><a href="/items">Items</a></li>
|
|
<li><a href="/items/transaction">Transaction</a></li>
|
|
<li><a href="/receipts">Receipts</a></li>
|
|
<li class="uk-nav-header">Points of Ease</li>
|
|
<li><a href="/poe/scanner">Transaction Scanner</a></li>
|
|
<li><a href="/poe/receipts">Receipts Scanner</a></li>
|
|
</ul>
|
|
</div>
|
|
</li>
|
|
</ul>
|
|
|
|
</div>
|
|
<!-- Breadcrumbs Navigation -->
|
|
<div class="uk-navbar-center uk-visible@m">
|
|
<ul class="uk-breadcrumb uk-margin-remove">
|
|
<li class="uk-disabled" style="cursor: pointer;"><span><strong>{{current_site}}</strong></span>
|
|
<div uk-dropdown="mode: hover">
|
|
<ul class="uk-nav uk-dropdown-nav">
|
|
<li class="uk-nav-header">Select Site</li>
|
|
<li class="uk-nav-divider"></li>
|
|
{% for site in sites %}
|
|
{% if site == current_site %}
|
|
<li><a class="uk-disabled" href="#">{{site}}</a></li>
|
|
{% else %}
|
|
<li><a onclick="changeSite('{{site}}')">{{site}}</a></li>
|
|
{% endif %}
|
|
{% endfor %}
|
|
</ul>
|
|
</div>
|
|
</li>
|
|
<li style="cursor: default; user-select: none;" class="uk-disabled"><span>Logistics</span></li>
|
|
<li class="uk-disabled"><span>Items</span></li>
|
|
<li class="uk-disabled"><span>Editing</span></li>
|
|
</ul>
|
|
</div>
|
|
<!-- Profile/Management Navigation-->
|
|
<div class="uk-navbar-right">
|
|
<ul class="uk-navbar-nav">
|
|
<li>
|
|
<a href="#">
|
|
<img src="{{session['user']['profile_pic_url']}}" alt="Profile Picture" class="profile-pic uk-visible@m" style="width: 40px; height: 40px; border-radius: 50%; margin-right: 5px;">
|
|
{{username}}
|
|
</a>
|
|
<div class="uk-navbar-dropdown" uk-drop="mode: click; multi:false">
|
|
<ul class="uk-nav uk-navbar-dropdown-nav">
|
|
<li><a href="/profile">Profile</a></li>
|
|
<li><a onclick="toggleDarkMode()">Dark Mode</a></li>
|
|
<li><a href="/site-management">Site Management</a></li>
|
|
<li><a href="/administration">System Management</a></li>
|
|
<li><a href="/access/logout">Logout</a></li>
|
|
</ul>
|
|
</div>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</nav>
|
|
<div class="uk-container">
|
|
<div class="uk-section">
|
|
<div uk-grid>
|
|
<!-- Barcode -->
|
|
<div class="uk-width-1-1 uk-margin">
|
|
<h1 id="itemBarcode" class="uk-heading-medium">test</h1>
|
|
</div>
|
|
<p class="uk-text-meta">This is where you will spend alot of time editing and refining what data is associated
|
|
with the selected SKU. This data is used across the apps to bring larger functionality and an understanding
|
|
of how this data is used in each app is required to make sure you dont change anything unexpectantly.
|
|
</p>
|
|
<!-- Item Name -->
|
|
<div class="uk-width-1-1 uk-margin">
|
|
<label class="uk-form-label" for="itemName">Item Common Name</label>
|
|
<input onchange="nameChanged()" style="" id="itemName" class="uk-input uk-form-blank uk-form-large" type="text" placeholder="test">
|
|
</div>
|
|
<!-- Item Brand -->
|
|
<div class="uk-width-1-1 uk-grid-small uk-margin" uk-grid>
|
|
<div class="uk-width-1-2">
|
|
<label class="uk-form-label" for="itemBrand">Item Brand</label>
|
|
<input id="itemBrand" class="uk-input uk-disabled" type="text">
|
|
</div>
|
|
<div class="uk-width-1-2 uk-margin-auto-top">
|
|
<button onclick="openBrandsModal('brand', 'brandsPage')" class="uk-button uk-button-default uk-margin-remove-left">Select Brand</button>
|
|
</div>
|
|
</div>
|
|
<!-- item types -->
|
|
<div class="uk-width-1-1 uk-margin">
|
|
<div uk-grid>
|
|
<div class="uk-width-1-2">
|
|
<caption>Item Type</caption>
|
|
<select onchange="selectChanged('row_type')" id="itemTypeSelect" class="uk-select">
|
|
</select>
|
|
</div>
|
|
<div class="uk-width-1-2">
|
|
<caption>Item Subtype</caption>
|
|
<select onchange="selectChanged('item_type')" id="itemSubTypeSelect" class="uk-select">
|
|
</select>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<!-- Item Description -->
|
|
<div class="uk-width-1-1 uk-margin">
|
|
<label class="uk-form-label" for="itemDescription">SKU Description</label>
|
|
<textarea onchange="descriptionChanged()" id="itemDescription" name="test" class="uk-textarea" placeholder="This is the items description..."></textarea>
|
|
</div>
|
|
<!-- Tags -->
|
|
<div class="uk-width-1-1 uk-margin">
|
|
<p style="color: red;" class="uk-hidden@s">Tags are currently hidden on smaller screens for development reasons...</p>
|
|
<table class="uk-visible@s uk-table uk-table-striped uk-table-small">
|
|
<caption>List out Item tags for filtering purposes...</caption>
|
|
<thead>
|
|
<tr>
|
|
<th class="uk-table-expand">Tags</th>
|
|
<th class="uk-width-1-4 uk-text-nowrap"><input onkeydown="addTag(event)" class="uk-input uk-form-small" type="text" id="tagInput" placeholder="Add a tag..."></th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
<tr>
|
|
<td id="tagsRow" class="uk-table-expand"></td>
|
|
<td class="uk-text-nowrap"><button onclick="addTag(event)" class="uk-align-right uk-button uk-button-small uk-button-default">Add Tag</button></td>
|
|
</tr>
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
<!-- Weblinks -->
|
|
<div class="uk-width-1-1 uk-margin">
|
|
<table class="uk-table uk-table-striped">
|
|
<caption>Listed out links associated with this Item; its recommended that you have at least a "main" link...</caption>
|
|
<thead>
|
|
<tr>
|
|
<th>Name</th>
|
|
<th class="uk-table-expand uk-text-truncate">Web Link</th>
|
|
<th class="uk-width-1-4">
|
|
<span>
|
|
<button class="uk-button uk-button-small uk-button-default uk-align-right uk-margin-remove" uk-toggle="target: #addWeblinkModal" type="button">Add Weblink</button>
|
|
</span>
|
|
</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody id='weblinksTableBody'>
|
|
<!-- populates with javascript -->
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
<!-- Tabs Element; references, food info, logistics, purchasing, packaging, linked items -->
|
|
<div class="uk-width-1-1 uk-margin">
|
|
<ul class="uk-flex-center" uk-tab>
|
|
<li class="uk-active"><a href="#">References</a></li>
|
|
<li><a herf="#">Purchasing/Packaging</a></li>
|
|
<li><a href="#">Food Info</a></li>
|
|
<li><a href="#">Logistics Info</a></li>
|
|
<li id="linkedListLink" class="uk-disabled"><a>Linked Items</a></li>
|
|
<li id="barcodesTab"><a>Associated Barcodes</a></li>
|
|
<li><a href="">Search String</a></li>
|
|
<li><a href="">Danger Zone</a></li>
|
|
|
|
</ul>
|
|
<div class="uk-switcher uk-margin">
|
|
<!-- References -->
|
|
<div uk-grid>
|
|
<div class="uk-width-1-1">
|
|
<table class="uk-width-1-1 uk-table uk-table-striped">
|
|
<caption>These are all the place in the apps that this item is referenced...</caption>
|
|
<thead>
|
|
<tr>
|
|
<th class="uk-width-1-4">Reference type</th>
|
|
<th class="uk-width-3-4 uk-table-expand uk-text-truncate">Reference Name</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody id="referenceTableBody">
|
|
<!-- populated by javascript -->
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
</div>
|
|
<!-- Purchasing/Packaging -->
|
|
<div uk-grid>
|
|
<div class="uk-width-1-1" uk-grid>
|
|
<div class="uk-width-1-6@s">
|
|
<label class="uk-form-label" for="safetyStock">Safety Stock</label>
|
|
<input onchange="itemInfoChanged('safety_stock')" class="uk-input" id="safetyStock" type="text" placeholder="Some text...">
|
|
</div>
|
|
<div class="uk-width-1-6@s">
|
|
<label class="uk-form-label" for="leadTimeInDays">Lead Time (days)</label>
|
|
<input onchange="itemInfoChanged('lead_time_days')" class="uk-input" id="leadTimeInDays" type="text" placeholder="Some text...">
|
|
</div>
|
|
<div class="uk-width-1-6@s">
|
|
<label class="uk-form-label" for="skuCost">Cost</label>
|
|
<input onchange="itemInfoChanged('cost')" class="uk-input" id="skuCost" type="text" placeholder="">
|
|
</div>
|
|
<div class="uk-width-1-6@s">
|
|
<label class="uk-form-label" for="uom_quantity">Single Quantity</label>
|
|
<input onchange="itemInfoChanged('uom_quantity')" class="uk-input" id="uom_quantity" type="text" placeholder="">
|
|
</div>
|
|
<div class="uk-width-1-6@s">
|
|
<label class="uk-form-label" for="uom">Unit of Measure</label>
|
|
<select onchange="itemInfoChanged('uom')" id="uom" class="uk-select" aria-label="Custom controls">
|
|
{% for unit in units %}
|
|
<option value="{{unit['id']}}">{{unit['fullname']}}</option>
|
|
{% endfor %}
|
|
</select>
|
|
</div>
|
|
</div>
|
|
<div class="uk-width-1-1">
|
|
<div>
|
|
<label class="uk-form-label" for="packaging">Packaging Description</label>
|
|
<input onchange="itemInfoChanged('packaging')" class="uk-input" id="packaging" type="text" placeholder="This is an example of a box of examples...">
|
|
</div>
|
|
</div>
|
|
<div class="uk-width-1-1">
|
|
<label><input onclick="itemInfoChanged('ai_pick')" id="aiPickableCheckbox" class="uk-checkbox" type="checkbox"> <strong>AI Pickable</strong> - this determines if this item is used in AI systems.</label>
|
|
</div>
|
|
<div class="uk-width-1-2@m">
|
|
<caption class="uk-text-meta">Here are all the prefixes that have been set up for this SKU</caption>
|
|
<table style="margin-bottom: 0px;" class="uk-table uk-table-striped">
|
|
<tbody id="prefixesTableBody">
|
|
</tbody>
|
|
</table>
|
|
<button onclick="openAddPrefixesModal()" class="uk-button add-button"><i class="uk-flex-middle material-symbols-outlined" style="">add_circle</i></button>
|
|
</div>
|
|
<div class="uk-width-1-2@m">
|
|
<caption class="uk-text-meta">Here are all the conversions that have been set up for this SKU</caption>
|
|
<table style="margin-bottom: 0px;" class="uk-table uk-table-striped">
|
|
<tbody id="conversionsTableBody">
|
|
</tbody>
|
|
</table>
|
|
<button onclick="openAddConversionsModal()" class="uk-button add-button"><i class="uk-flex-middle material-symbols-outlined" style="">add_circle</i></button>
|
|
</div>
|
|
</div>
|
|
<!-- Food Info-->
|
|
<div uk-grid>
|
|
<div class="uk-width-1-1">
|
|
<label><input onclick="foodInfoChanged('expires')" id="expiresCheckbox" class="uk-checkbox" type="checkbox"> <strong>Expires</strong> - this determines if this item expires.</label>
|
|
</div>
|
|
<div class="uk-width-1-6@s uk-margin-small">
|
|
<div>
|
|
<label class="uk-form-label" for="expirePeriod">Default Expiration Period</label>
|
|
<input onchange="foodInfoChanged('default_expiration')" class="uk-input" id="expirePeriod" type="text" placeholder="Days">
|
|
</div>
|
|
</div>
|
|
<div class="uk-width-1-1 uk-margin">
|
|
<p style="color: red;" class="uk-hidden@s">Food Groups are currently hidden on smaller screens for development reasons...</p>
|
|
<table class="uk-visible@s uk-table uk-table-striped uk-table-small">
|
|
<caption>List out Food Groups for filtering purposes...</caption>
|
|
<thead>
|
|
<tr>
|
|
<th class="uk-width-3-4">Food Groups</th>
|
|
<th class="uk-width-1-4 uk-text-nowrap"><input onkeydown="addFoodGroup(event)" class="uk-input uk-form-small" type="text" id="foodGroupsInput" placeholder="Add a food group..."></th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
<tr>
|
|
<td id="foodGroupsTagsRow" class="uk-width-3-4 uk-table-expand"></td>
|
|
<td class="uk-width-1-4 uk-text-nowrap"><button onclick="addFoodGroup(event)" class="uk-align-right uk-button uk-button-small uk-button-default">Add Food Group</button></td>
|
|
</tr>
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
<div class="uk-width-1-1 uk-margin">
|
|
<p style="color: red;" class="uk-hidden@s">Ingrediants are currently hidden on smaller screens for development reasons...</p>
|
|
<table class="uk-visible@s uk-table uk-table-striped uk-table-small">
|
|
<caption>List out ingrediants for filtering purposes...</caption>
|
|
<thead>
|
|
<tr>
|
|
<th class=" uk-width-3-4">Ingrediants</th>
|
|
<th class="uk-width-1-4 uk-text-nowrap"><input onkeydown="addIngrediant(event)" class="uk-input uk-form-small" type="text" id="ingrediantsInput" placeholder="Add an ingrediant..."></th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
<tr>
|
|
<td id="ingrediantsRow" class="uk-width-3-4"></td>
|
|
<td class="uk-width-1-4 uk-text-nowrap"><button onclick="addIngrediant(event)" class="uk-align-right uk-button uk-button-small uk-button-default">Add ingrediant</button></td>
|
|
</tr>
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
</div>
|
|
<!-- Logistics Info -->
|
|
<div uk-grid>
|
|
<!-- Primary Location -->
|
|
<div class="uk-width-1-1 uk-margin uk-grid-medium" uk-grid>
|
|
<div class="uk-width-1-2@m uk-grid-small" uk-grid>
|
|
<div class="uk-width-3-4 uk-margin-auto-top">
|
|
<label for="primaryZone">Primary Zone</label>
|
|
<input class="uk-input uk-disabled" id="primaryZone" type="text">
|
|
</div>
|
|
<div class="uk-width-1-4 uk-margin-auto-top">
|
|
<button onclick="openZonesModal('primary_zone', 'zonesPage')" class="uk-button uk-button-default">Select</button>
|
|
</div>
|
|
</div>
|
|
<div class="uk-width-1-2@m uk-grid-small" uk-grid>
|
|
<div class="uk-width-3-4 uk-margin-auto-top">
|
|
<label for="primaryLocation">Primary Location</label>
|
|
<input class="uk-input uk-disabled" id="primaryLocation" type="text">
|
|
</div>
|
|
<div class="uk-width-1-4 uk-margin-auto-top">
|
|
<button onclick="openLocationsModal('primary_location', 'locationsPage')" class="uk-button uk-button-default">Select</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<!-- Auto Issue Location -->
|
|
<div class="uk-width-1-1 uk-margin uk-grid-medium" uk-grid>
|
|
<div class="uk-width-1-2@m uk-grid-small" uk-grid>
|
|
<div class="uk-width-3-4 uk-margin-auto-top">
|
|
<label for="autoZone">Auto Issue Zone</label>
|
|
<input class="uk-input uk-disabled" id="autoZone" type="text">
|
|
</div>
|
|
<div class="uk-width-1-4 uk-margin-auto-top">
|
|
<button onclick="openZonesModal('auto_issue_zone', 'zonesPage')" class="uk-button uk-button-default">Select</button>
|
|
</div>
|
|
</div>
|
|
<div class="uk-width-1-2@m uk-grid-small" uk-grid>
|
|
<div class="uk-width-3-4 uk-margin-auto-top">
|
|
<label for="autoLocation">Auto Issue Location</label>
|
|
<input class="uk-input uk-disabled" id="autoLocation" type="text">
|
|
</div>
|
|
<div class="uk-width-1-4 uk-margin-auto-top">
|
|
<button onclick="openLocationsModal('auto_issue_location', 'locationsPage')" class="uk-button uk-button-default">Select</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="uk-width-1-1">
|
|
<caption>Here are all the locations that this SKU has quantity in...</caption>
|
|
<table class="uk-table uk-table-striped">
|
|
<thead>
|
|
<tr>
|
|
<th>Location</th>
|
|
<th>QOH</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody id="locationsTableBody">
|
|
</tbody>
|
|
</table>
|
|
<button onclick="openPossibleLocationsModal()" class="uk-button add-button"><i class="uk-flex-middle material-symbols-outlined" style="">add_circle</i></button>
|
|
|
|
</div>
|
|
</div>
|
|
<!-- Linked Items -->
|
|
<div uk-grid>
|
|
<div class="uk-width-1-1">
|
|
<p class="uk-text-meta">A linked Item functions as a backend item that is used during scanning and/or
|
|
receipting into the system. In essence the item will be converted into the main list item during
|
|
transacting. This is represented as below:
|
|
</p>
|
|
</div>
|
|
<div class="uk-width-1-1 uk-grid-small" uk-grid>
|
|
<div class="uk-width-auto">
|
|
<button onclick="openItemsModal('items', 'itemsPage')" class="uk-button uk-button-default">lookup</button>
|
|
</div>
|
|
<div class="uk-width-auto">
|
|
<input class="uk-input uk-disabled" id="linked_item" type="text">
|
|
<input class="uk-input uk-hidden" id="linked_item_id" type="text">
|
|
</div>
|
|
<div class="uk-width-auto">
|
|
<input class="uk-input uk-form-width-small" id="conversion_factor" type="text">
|
|
</div>
|
|
<div class="uk-width-auto">
|
|
<input class="uk-input uk-form-width-small uk-disabled" id="conversion_factor_uom" type="text">
|
|
</div>
|
|
<div class="uk-width-auto uk-flex uk-flex-middle">
|
|
<p class="uk-flex uk-flex-middle uk-flex-center"><strong>INTO</strong></p>
|
|
</div>
|
|
<div class="uk-width-auto">
|
|
<input class="uk-input uk-disabled uk-form-width-small" id="main_qty_uom" type="text">
|
|
</div>
|
|
<div class="uk-width-auto">
|
|
<input class="uk-input uk-disabled" id="main_barcode" type="text">
|
|
</div>
|
|
<div class="uk-width-auto">
|
|
<button id="linkAdd" class="uk-button uk-button-default">add</button>
|
|
</div>
|
|
</div>
|
|
<div class="uk-width-1-1">
|
|
<table class="uk-table uk-table-striped">
|
|
<thead>
|
|
<tr>
|
|
<th>Barcode</th>
|
|
<th>Name</th>
|
|
<th>Operations</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody id="linkedItemsTableBody"></tbody>
|
|
</table>
|
|
</div>
|
|
</div>
|
|
<!-- Barcodes -->
|
|
<div uk-grid>
|
|
<div class="uk-width-1-1">
|
|
<button onclick="openAddBarcodeModal()" class="uk-button uk-button-primary">Add Barcode</button>
|
|
</div>
|
|
<div class="uk-width-1-1">
|
|
<table class="uk-table uk-table-striped">
|
|
<thead>
|
|
<tr>
|
|
<th>Barcode</th>
|
|
<th>In Exchange</th>
|
|
<th>Out Exchange</th>
|
|
<th>descriptor</th>
|
|
<th>Operations</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody id="barcodesTableBody"></tbody>
|
|
</table>
|
|
</div>
|
|
</div>
|
|
<!-- Search_String -->
|
|
<div uk-grid>
|
|
<div class="uk-width-1-1">
|
|
<caption class="uk-text-meta">This portion of the search string is created by the system</caption>
|
|
<div style="margin-bottom: 0px;" class="uk-margin">
|
|
<textarea id="search_string_main" class="uk-textarea" rows="5" placeholder="Textarea" aria-label="Textarea"></textarea>
|
|
</div>
|
|
<button onclick="refreshSearchString()" class="uk-button add-button"><i class="uk-flex-middle material-symbols-outlined" style="">refresh</i></button>
|
|
</div>
|
|
</div>
|
|
<!-- Danger Zone -->
|
|
<div uk-grid>
|
|
<div class="uk-width-1-1">
|
|
<p class="uk-text-small">This place holds the secret dangerous buttons, for this purpose you will only be allowed here by the system admin. If there are any refrences to this item you will not be able to
|
|
inactivate this item.
|
|
</p>
|
|
<button id="inactiveButton" onclick="inactivateItem()" class="uk-button uk-button-danger">Inactivate</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<button id="saveButton" onclick="saveUpdated()" class="uk-button uk-button-primary floating-button"><span class="uk-flex material-icons">save</span></button>
|
|
<!-- Modals -->
|
|
<!-- This is the modal -->
|
|
<div id="zonesModal" uk-modal>
|
|
<div id="zonesModalInner" class="uk-modal-dialog uk-modal-body">
|
|
<h2 class="uk-modal-title">Select Zone</h2>
|
|
<p> Select a zone from the list</p>
|
|
<nav aria-label="Pagination">
|
|
<ul id="zonesPage" class="uk-pagination uk-flex-center" uk-margin>
|
|
<li><a href="#"><span uk-pagination-previous></span></a></li>
|
|
<li><a href="#">1</a></li>
|
|
<li class="uk-disabled"><span>…</span></li>
|
|
<li><a href="#">5</a></li>
|
|
<li><a href="#">6</a></li>
|
|
<li class="uk-active"><span aria-current="page">7</span></li>
|
|
<li><a href="#">8</a></li>
|
|
<li><a href="#"><span uk-pagination-next></span></a></li>
|
|
</ul>
|
|
</nav>
|
|
<table class="uk-table uk-table-striped uk-table-hover">
|
|
<thead>
|
|
<tr><th>Zone</th></tr>
|
|
</thead>
|
|
<tbody id="zonesTableBody">
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
</div>
|
|
<!-- Location Select Modal -->
|
|
<div id="LocationsModal" uk-modal>
|
|
<div id="locationsModalInner" class="uk-modal-dialog uk-modal-body">
|
|
<h2 class="uk-modal-title">Select Location</h2>
|
|
<p> Select a Location from the list</p>
|
|
<nav aria-label="Pagination">
|
|
<ul id="locationsPage" class="uk-pagination uk-flex-center" uk-margin>
|
|
<li><a href="#"><span uk-pagination-previous></span></a></li>
|
|
<li><a href="#">1</a></li>
|
|
<li class="uk-disabled"><span>…</span></li>
|
|
<li><a href="#">5</a></li>
|
|
<li><a href="#">6</a></li>
|
|
<li class="uk-active"><span aria-current="page">7</span></li>
|
|
<li><a href="#">8</a></li>
|
|
<li><a href="#"><span uk-pagination-next></span></a></li>
|
|
</ul>
|
|
</nav>
|
|
<table class="uk-table uk-table-striped uk-table-hover">
|
|
<thead>
|
|
<tr><th>Location</th></tr>
|
|
</thead>
|
|
<tbody id="selectlocationsTableBody">
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
</div>
|
|
<!-- Brands Modal -->
|
|
<div id="brandsModal" uk-modal>
|
|
<div id="brandsModalinner" class="uk-modal-dialog uk-modal-body">
|
|
<h2 class="uk-modal-title">Select Location</h2>
|
|
<p> Select a Location from the list</p>
|
|
<nav aria-label="Pagination">
|
|
<ul id="brandsPage" class="uk-pagination uk-flex-center" uk-margin>
|
|
<li><a href="#"><span uk-pagination-previous></span></a></li>
|
|
<li><a href="#">1</a></li>
|
|
<li class="uk-disabled"><span>…</span></li>
|
|
<li><a href="#">5</a></li>
|
|
<li><a href="#">6</a></li>
|
|
<li class="uk-active"><span aria-current="page">7</span></li>
|
|
<li><a href="#">8</a></li>
|
|
<li><a href="#"><span uk-pagination-next></span></a></li>
|
|
</ul>
|
|
</nav>
|
|
<table class="uk-table uk-table-striped uk-table-hover">
|
|
<thead>
|
|
<tr><th>Brand</th></tr>
|
|
</thead>
|
|
<tbody id="brandsTableBody">
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
</div>
|
|
<!-- Add Weblink Modal -->
|
|
<div id="addWeblinkModal" uk-modal>
|
|
<div id="weblinkModal" class="uk-modal-dialog uk-modal-body">
|
|
<h2 class="uk-modal-title">Add Weblink</h2>
|
|
<p>By adding a weblink you are giving others ways of better understanding what this item
|
|
is, if you wish for the link to show up in shopping-lists and or other parts of the system
|
|
give it the name "main". By using the same name you will be overwriting!
|
|
</p>
|
|
<div class="">
|
|
<label class="uk-form-label" for="weblinkName">Weblink Name</label>
|
|
<div class="uk-form-controls">
|
|
<input class="uk-input" id="weblinkName" type="text">
|
|
</div>
|
|
</div>
|
|
<div class="uk-margin-bottom">
|
|
<label class="uk-form-label" for="weblinkLink">Weblink</label>
|
|
<div class="uk-form-controls">
|
|
<input class="uk-input" id="weblinkLink" type="text">
|
|
</div>
|
|
</div>
|
|
<div id="weblinkModalFooter" class="uk-modal-footer">
|
|
<button onclick="addWebLink()" class="uk-button uk-button-default uk-align-right" type="button">Add</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<!-- Barcode Modal -->
|
|
<div id="barcodeModal" uk-modal>
|
|
<div id="barcodeModalBody" class="uk-modal-dialog uk-modal-body">
|
|
<h2 id="barcodeModalTitle" class="uk-modal-title">Add Barcode</h2>
|
|
<div class="uk-grid-small" uk-grid>
|
|
<div class="uk-width-1-1">
|
|
<label class="uk-form-label" for="barcodeNumber">Barcode</label>
|
|
<div class="uk-form-controls">
|
|
<input class="uk-input" id="barcodeNumber" type="text">
|
|
</div>
|
|
</div>
|
|
<div class="uk-width-1-1" uk-grid>
|
|
<div class="uk-width-1-2">
|
|
<label class="uk-form-label" for="inExchangeNumber">In Exchange</label>
|
|
<div class="uk-form-controls">
|
|
<input class="uk-input" id="inExchangeNumber" type="number">
|
|
</div>
|
|
</div>
|
|
<div class="uk-width-1-2">
|
|
<label class="uk-form-label" for="outExchangeNumber">Out Exchange</label>
|
|
<div class="uk-form-controls">
|
|
<input class="uk-input" id="outExchangeNumber" type="number">
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="uk-width-1-1">
|
|
<label class="uk-form-label" for="barcodeDescriptor">Barcode Descriptor</label>
|
|
<div class="uk-form-controls">
|
|
<input class="uk-input" id="barcodeDescriptor" type="text">
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div id="barcodeModalFooter" class="uk-modal-footer">
|
|
<button id="barcodeModalButton" onclick="" class="uk-button uk-button-default uk-align-right" type="button"></button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<!-- This is the modal -->
|
|
<div id="itemsModal" uk-modal>
|
|
<div id="itemsModalInner" class="uk-modal-dialog uk-modal-body " uk-overflow-auto>
|
|
<h2 class="uk-modal-title">Select Item</h2>
|
|
<p>Select an Item from the system...</p>
|
|
<div id="searchItemsForm" onkeydown="searchTable(event, 'items', 'itemsPage')" class="uk-search uk-search-default uk-align-center">
|
|
<input id="searchItemsInput" class="uk-border-pill uk-search-input" type="search" placeholder="" aria-label="">
|
|
<span class="uk-search-icon-flip" uk-search-icon></span>
|
|
</div>
|
|
<nav aria-label="Pagination">
|
|
<ul id="itemsPage" class="uk-pagination uk-flex-center" uk-margin>
|
|
<li><a href="#"><span uk-pagination-previous></span></a></li>
|
|
<li><a href="#">1</a></li>
|
|
<li class="uk-disabled"><span>…</span></li>
|
|
<li><a href="#">5</a></li>
|
|
<li><a href="#">6</a></li>
|
|
<li class="uk-active"><span aria-current="page">7</span></li>
|
|
<li><a href="#">8</a></li>
|
|
<li><a href="#"><span uk-pagination-next></span></a></li>
|
|
</ul>
|
|
</nav>
|
|
<table class="uk-table uk-table-striped uk-table-hover">
|
|
<thead>
|
|
<tr>
|
|
<th>ID</th>
|
|
<th>Barcode</th>
|
|
<th>Name</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody id="itemsTableBody">
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
</div>
|
|
<!-- Conversions Modal -->
|
|
<div id="conversionsModal" uk-modal>
|
|
<div class="uk-modal-dialog">
|
|
<button class="uk-modal-close-default" type="button" uk-close></button>
|
|
<div class="uk-modal-header">
|
|
<h2 class="uk-modal-title">Conversions</h2>
|
|
</div>
|
|
<div class="uk-modal-body">
|
|
<div class="uk-grid-small" uk-grid>
|
|
<div class="uk-width-1-1">
|
|
<p class="uk-text-meta">To create a conversion allows the use of differing unit of measures in other parts of the system; mainly recipes. For example, it allows for the ability to
|
|
use tablespoons for recipes while tracking the sku as grams. Here is where you can add or edit your conversion:
|
|
</p>
|
|
</div>
|
|
<div class="uk-width-1-2@m">
|
|
<div class="uk-margin">
|
|
<label class="uk-form-label" for="parent_uom_quantity">SKU UOM QTY</label>
|
|
<div class="uk-form-controls">
|
|
<input class="uk-input uk-disabled" id="parent_uom_quantity" type="text" placeholder="" value="1">
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="uk-width-1-2@m">
|
|
<div class="uk-margin">
|
|
<label class="uk-form-label" for="parent_uom">SKU UOM</label>
|
|
<div class="uk-form-controls">
|
|
<input class="uk-input uk-disabled" id="parent_uom" type="text" placeholder="">
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="uk-width-1-1 uk-text-center">
|
|
<div>
|
|
<p class="uk-text-lead">TO</p>
|
|
</div>
|
|
</div>
|
|
<div class="uk-width-1-2@m">
|
|
<div class="uk-margin">
|
|
<label class="uk-form-label" for="conversion_factor">Conversion Factor</label>
|
|
<div class="uk-form-controls">
|
|
<input id="conversion_factor_modal" class="uk-input" type="text">
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="uk-width-1-2@m">
|
|
<div class="uk-margin">
|
|
<label class="uk-form-label" for="conversion_uom">Conversion UOM</label>
|
|
<select id="conversion_uom" class="uk-select" aria-label="Select">
|
|
{% for unit in units %}
|
|
<option value="{{unit['id']}}">{{unit['fullname']}}</option>
|
|
{% endfor %}
|
|
</select>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="uk-modal-footer uk-text-right">
|
|
<button class="uk-button uk-button-default uk-modal-close" type="button">Cancel</button>
|
|
<button id="conversionSubmitButton" class="uk-button uk-button-primary" type="button">Save</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<!-- Prefix Modal -->
|
|
<div id="prefixesModal" uk-modal>
|
|
<div id="prefixesModalInner" class="uk-modal-dialog uk-modal-body " uk-overflow-auto>
|
|
<h2 class="uk-modal-title">Select Item</h2>
|
|
<p>Select an Prefix from the system...</p>
|
|
<nav aria-label="Pagination">
|
|
<ul id="prefixesModalPage" class="uk-pagination uk-flex-center" uk-margin>
|
|
<li><a href="#"><span uk-pagination-previous></span></a></li>
|
|
<li><a href="#">1</a></li>
|
|
<li class="uk-disabled"><span>…</span></li>
|
|
<li><a href="#">5</a></li>
|
|
<li><a href="#">6</a></li>
|
|
<li class="uk-active"><span aria-current="page">7</span></li>
|
|
<li><a href="#">8</a></li>
|
|
<li><a href="#"><span uk-pagination-next></span></a></li>
|
|
</ul>
|
|
</nav>
|
|
<table class="uk-table uk-table-striped uk-table-hover">
|
|
<thead>
|
|
<tr>
|
|
<th>ID</th>
|
|
<th>Name</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody id="prefixesModalTableBody">
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
</div>
|
|
<!-- Prefix Modal -->
|
|
<div id="NewLocationsModal" uk-modal>
|
|
<div id="NewLocationsModalInner" class="uk-modal-dialog uk-modal-body " uk-overflow-auto>
|
|
<h2 class="uk-modal-title">Select Item</h2>
|
|
<p>Select an Prefix from the system...</p>
|
|
<nav aria-label="Pagination">
|
|
<ul id="NewLocationsModalPage" class="uk-pagination uk-flex-center" uk-margin>
|
|
<li><a href="#"><span uk-pagination-previous></span></a></li>
|
|
<li><a href="#">1</a></li>
|
|
<li class="uk-disabled"><span>…</span></li>
|
|
<li><a href="#">5</a></li>
|
|
<li><a href="#">6</a></li>
|
|
<li class="uk-active"><span aria-current="page">7</span></li>
|
|
<li><a href="#">8</a></li>
|
|
<li><a href="#"><span uk-pagination-next></span></a></li>
|
|
</ul>
|
|
</nav>
|
|
<table class="uk-table uk-table-striped uk-table-hover">
|
|
<thead>
|
|
<tr>
|
|
<th>Zone</th>
|
|
<th>Name</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody id="NewLocationsModalTableBody">
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
</div>
|
|
|
|
|
|
</body>
|
|
<script src="{{ url_for('items_api.static', filename='itemEditHandler.js') }}"></script>
|
|
<script>const item_id = {{id|tojson}}</script>
|
|
</html> |