Implement Add Stock modal

This commit is contained in:
2021-11-08 23:11:05 +01:00
parent b4e561279b
commit fbb60b455f
8 changed files with 173 additions and 14 deletions

View File

@@ -1,3 +1,31 @@
function fill_add_stock_modal_component(data) {
// component has been selected. Process it:
document.getElementById('add-stock-search').value = '';
console.log(data);
var template = document.querySelector('#add-stock-modal-component-template');
var container = document.querySelector('#add-stock-modal-component-container');
container.innerHTML = '';
var comp_elem = template.content.cloneNode(true);
if (data.ro_image) {
comp_elem.querySelector('#add-stock-cmp-img').setAttribute('src', data.ro_image);
}
var description_container = comp_elem.querySelector('#add-stock-cmp-desc-container');
var heading = document.createElement('h6');
heading.appendChild(document.createTextNode(data.name));
description_container.appendChild(heading);
if (data.package_data && data.package_data.name) {
description_container.appendChild(document.createTextNode('in '+data.package_data.name));
}
if (data.ro_manufacturer_name) {
description_container.appendChild(document.createElement('br'));
description_container.appendChild(document.createTextNode('by '+data.ro_manufacturer_name));
}
document.querySelector('#add-stock-modal-comp-uuid').value = data.id;
console.log("Selected element: "+data.id);
container.appendChild(comp_elem);
}
new AutocompleteCustomUi('add-stock-search', 'add-stock-search-ac-dropdown',
function(search, autocomplete_obj) {
api_search_component(search, function(results) {
@@ -36,9 +64,9 @@ function(search, autocomplete_obj) {
node.appendChild(img_container);
node.appendChild(text_container);
test.push({'ui': node, 'data': c.url})
test.push({'ui': node, 'data': c})
}
autocomplete_obj.show_results(test,
function(data) {console.log(data);});
function(data){fill_add_stock_modal_component(data);});
}, function(){});
});

View File

@@ -11,6 +11,8 @@ class AutocompleteCustomUi {
this.query_callback(document.getElementById(this.text_id).value, this);
}, autocomplete_query_delay_ms).bind(this));
this.dropdown_data = {};
}
/**
@@ -24,15 +26,17 @@ class AutocompleteCustomUi {
var ul = document.getElementById(this.dropdown_id);
ul.innerHTML = '';
this.select_data = {};
this.dropdown_data = {};
for (var i = 0; i < nodes_to_add.length; i++) {
var ui = nodes_to_add[i]['ui'];
var data = nodes_to_add[i]['data']
var dropdown_node = document.createElement('li');
dropdown_node.dataset.ac_clicked = data;
dropdown_node.dataset.ac_clicked = i;
this.dropdown_data[i] = data;
dropdown_node.addEventListener('click',
(e) => {
data_clicked_callback(e.currentTarget.dataset.ac_clicked);
data_clicked_callback(this.dropdown_data[e.currentTarget.dataset.ac_clicked]);
var text_box = document.getElementById(this.text_id);
var dropdown = bootstrap.Dropdown.getOrCreateInstance(text_box);
dropdown.hide();

View File

@@ -31,4 +31,8 @@ function api_search_user(search, onSuccess, onFail) {
function api_search_component(search, onSuccess, onFail) {
return api_ajax_request_without_send('GET', api_urls_v1['component-list']+`?search=${encodeURIComponent(search)}`, function(method, url, json) {onSuccess(json);}, onFail);
}
function api_get_component_from_id(id, onSuccess, onFail) {
return api_ajax_request_without_send('GET', api_urls_v1['component-list']+`?search=${encodeURIComponent(id)}`, function(method, url, json) {onSuccess(json.results[0]);}, onFail);
}