mirror/Part-DB.Part-DB-server
1
0
Fork 1
mirror of https://github.com/Part-DB/Part-DB-server.git synced 2025-06-21 01:25:55 +02:00
Code Issues Projects Releases Packages Wiki Activity Actions

Mark newly created entities better in structural entity selector

Browse source
This commit is contained in:
Jan Böhmer 2023-07-12 23:58:40 +02:00
parent 6cd9640b30
commit c4439cc9db
2 changed files with 21 additions and 2 deletions
Download patch file Download diff file Expand all files Collapse all files

20
assets/controllers/elements/structural_entity_select_controller.js
View file

@ -22,6 +22,8 @@ import '../../css/components/tom-select_extensions.css';
import TomSelect from "tom-select";
import {Controller} from "@hotwired/stimulus";
import {trans, ENTITY_SELECT_GROUP_NEW_NOT_ADDED_TO_DB} from '../../translator.js'
export default class extends Controller {
_tomSelect;
@ -40,7 +42,7 @@ export default class extends Controller {
allowEmptyOption: true,
selectOnTab: true,
maxOptions: null,
create: allowAdd,
create: allowAdd ? this.createItem.bind(this) : false,
createFilter: /\D/, //Must contain a non-digit character, otherwise they would be recognized as DB ID
searchField: [
@ -68,6 +70,14 @@ export default class extends Controller {
this._tomSelect.sync();
}
createItem(input, callback) {
callback({
value: input,
text: input,
not_in_db_yet: true,
});
}
updateValidity() {
//Mark this input as invalid, if the selected option is disabled
@ -104,7 +114,13 @@ export default class extends Controller {
if (data.parent) {
name += escape(data.parent) + " → ";
}
name += "<b>" + escape(data.text) + "</b>";
if (data.not_in_db_yet) {
//Not yet added items are shown italic and with a badge
name += "<i><b>" + escape(data.text) + "</b></i>" + "<span class='ms-3 badge bg-info badge-info'>" + trans(ENTITY_SELECT_GROUP_NEW_NOT_ADDED_TO_DB) + "</span>";
} else {
name += "<b>" + escape(data.text) + "</b>";
}
return '<div>' + (data.image ? "<img class='structural-entity-select-image' style='margin-right: 5px;' ' src='" + data.image + "'/>" : "") + name + '</div>';
}