Still fixing the bug

Signed-off-by: Egor Savkin <es@m-labs.hk>
This commit is contained in:
Egor Savkin 2023-09-14 17:47:45 +08:00
parent dfbf9cbfe7
commit 840b0223a7
3 changed files with 77 additions and 53 deletions

View File

@ -6,7 +6,7 @@ import { createRoot } from "react-dom/client";
import PropTypes from "prop-types"; import PropTypes from "prop-types";
import { DragDropContext, Droppable, Draggable } from "react-beautiful-dnd"; import { DragDropContext, Droppable, Draggable } from "react-beautiful-dnd";
import { v4 as uuidv4 } from 'uuid'; import { v4 as uuidv4 } from 'uuid';
import { OptionsDialogPopup, OptionsSummaryPopup, fill_ext_data } from "./shop_components.jsx";import { OverlayTrigger } from "react-bootstrap"; import { OptionsDialogPopup, OptionsSummaryPopup, FilterOptions, fill_ext_data } from "./shop_components.jsx";import { OverlayTrigger } from "react-bootstrap";
const data = window.shop_data; const data = window.shop_data;
const itemsUnfoldedList = Array.from(data.columns.backlog.categories.map(groupId => groupId.itemIds).flat()); const itemsUnfoldedList = Array.from(data.columns.backlog.categories.map(groupId => groupId.itemIds).flat());
@ -718,13 +718,13 @@ class ProductCartItem extends React.PureComponent {
this.setState(options_data); this.setState(options_data);
}), }),
unmount: ((outvar) => { unmount: ((outvar) => {
console.log("delete", outvar, this.state.alive); console.log("delete", outvar);
//let opt_data = this.state; //let opt_data = this.state;
//delete opt_data[outvar]; //delete opt_data[outvar];
//this.setState(opt_data); //this.setState(opt_data);
// TODO this needs to be stopped when the whole card getting unmounted // TODO this needs to be stopped when the whole card getting unmounted
if (this.state.alive) //if (this.state.alive)
delete options_data[outvar]; // delete options_data[outvar];
}) })
}} }}
/>) : null) } />) : null) }
@ -1442,6 +1442,9 @@ class OrderSumary extends React.PureComponent {
} }
options = itemsData[index] && itemsData[index].options; options = itemsData[index] && itemsData[index].options;
options_data = itemsData[index] && itemsData[index].options_data; options_data = itemsData[index] && itemsData[index].options_data;
let options_data_clone = Object.assign({}, options_data)
let display_options = FilterOptions(options, options_data_clone); // TODO fix faulty display
console.log(options, options_data, display_options)
return ( return (
<tr key={item.id} <tr key={item.id}
@ -1470,7 +1473,7 @@ class OrderSumary extends React.PureComponent {
src={`/images/${warning.icon}`} src={`/images/${warning.icon}`}
/> />
) : ( (options && options_data) ? ) : ( (options && options_data) ?
( <OptionsSummaryPopup id={item.id + "options"} data={options_data} /> ) : null ( <OptionsSummaryPopup id={item.id + "options"} data={display_options} /> ) : null
)} )}
{(!warning && !options) && ( {(!warning && !options) && (
@ -1848,7 +1851,7 @@ class Shop extends React.PureComponent {
const item_data = clonedCartData[i]; const item_data = clonedCartData[i];
crate.items.push({ crate.items.push({
'pn': item.name_number, 'pn': item.name_number,
'options': item_data.options_data ? item_data.options_data : null, 'options': (item_data.options_data && item_data.options) ? FilterOptions(item_data.options, item_data.options_data) : null, // TODO
}); });
} }

View File

@ -97,10 +97,6 @@ class Switch extends Component {
this.props.target.construct(this.props.outvar, this.state.checked); this.props.target.construct(this.props.outvar, this.state.checked);
} }
componentWillUnmount() {
this.props.target.unmount(this.props.outvar);
}
handleClick() { handleClick() {
// Update the state object with the new value for outvar // Update the state object with the new value for outvar
let new_checked = !this.state.checked; let new_checked = !this.state.checked;
@ -165,10 +161,6 @@ class Line extends Component {
this.props.target.construct(this.props.outvar, this.state.text); this.props.target.construct(this.props.outvar, this.state.text);
} }
componentWillUnmount() {
this.props.target.unmount(this.props.outvar);
}
handleClick(element) { handleClick(element) {
let text = element.target.value; let text = element.target.value;
this.setState({ this.setState({
@ -225,10 +217,6 @@ class SwitchLine extends Component {
this.props.target.construct(this.props.outvar, this.state); this.props.target.construct(this.props.outvar, this.state);
} }
componentWillUnmount() {
this.props.target.unmount(this.props.outvar);
}
handleText(element) { handleText(element) {
let new_state = { let new_state = {
...this.state, ...this.state,
@ -329,7 +317,12 @@ export function ProcessOptions({options, data, target, id}) {
} else if (options.type === "Group") { } else if (options.type === "Group") {
return ( return (
<div className="border rounded" key={id + "group"}> <div className="border rounded" key={id + "group"}>
{ ProcessOptions({options: jsonLogic.apply(options.items, data), data: data, target: target, id: id}) } {ProcessOptions({
options: jsonLogic.apply(options.items, data),
data: data,
target: target,
id: id
})}
</div>); </div>);
} else { } else {
return componentsList["Default"](options.type, id + "missing"); return componentsList["Default"](options.type, id + "missing");
@ -340,6 +333,34 @@ export function ProcessOptions({options, data, target, id}) {
} }
} }
export function FilterOptions(options, data) {
let options_t = trueTypeOf(options);
let target = {};
console.log(options, data);
if (options_t === "array") {
options.map((option_item, _) => {
Object.assign(target, FilterOptions(option_item, data))
});
} else if (options_t === "object") {
if (
trueTypeOf(options.type) === "string" &&
(trueTypeOf(options.args) === "object" || trueTypeOf(options.items) === "array")
) {
if (options.type in componentsList) {
console.log(options.args.outvar, data[options.args.outvar], data);
target[options.args.outvar] = data[options.args.outvar];
} else if (options.type === "Group") {
Object.assign(target, FilterOptions(jsonLogic.apply(options.items, data), data))
}
} else {
Object.assign(target, FilterOptions(jsonLogic.apply(options, data), data))
}
}
console.log(target)
return target
}
export function OptionsDialogPopup({options, data, target, id, big}) { export function OptionsDialogPopup({options, data, target, id, big}) {
const [show, setShow] = useState(false); const [show, setShow] = useState(false);
const ref = useClickAway((e) => { const ref = useClickAway((e) => {

View File

@ -302,10 +302,10 @@ const shop_data = {
"if": [ "if": [
{"!": {"var": "out_first_group"}}, {"!": {"var": "out_first_group"}},
{type: "Group", items: [ {type: "Group", items: [
{type: "Switch", args: {title: "Termination #0", fallback: true, outvar: "term_0", tip: "Enable termination on channel #0"}}, {type: "Switch", args: {title: "Termination #0", outvar: "term_0", tip: "Enable termination on channel #0"}},
{type: "Switch", args: {title: "Termination #1", fallback: true, outvar: "term_1", tip: "Enable termination on channel #1"}}, {type: "Switch", args: {title: "Termination #1", outvar: "term_1", tip: "Enable termination on channel #1"}},
{type: "Switch", args: {title: "Termination #2", fallback: true, outvar: "term_2", tip: "Enable termination on channel #2"}}, {type: "Switch", args: {title: "Termination #2", outvar: "term_2", tip: "Enable termination on channel #2"}},
{type: "Switch", args: {title: "Termination #3", fallback: true, outvar: "term_3", tip: "Enable termination on channel #3"}}, {type: "Switch", args: {title: "Termination #3", outvar: "term_3", tip: "Enable termination on channel #3"}},
]}, ]},
null null
] ]
@ -315,10 +315,10 @@ const shop_data = {
"if": [ "if": [
{"!": {"var": "out_second_group"}}, {"!": {"var": "out_second_group"}},
{type: "Group", items: [ {type: "Group", items: [
{type: "Switch", args: {title: "Termination #4", fallback: true, outvar: "term_4", tip: "Enable termination on channel #4"}}, {type: "Switch", args: {title: "Termination #4", outvar: "term_4", tip: "Enable termination on channel #4"}},
{type: "Switch", args: {title: "Termination #5", fallback: true, outvar: "term_5", tip: "Enable termination on channel #5"}}, {type: "Switch", args: {title: "Termination #5", outvar: "term_5", tip: "Enable termination on channel #5"}},
{type: "Switch", args: {title: "Termination #6", fallback: true, outvar: "term_6", tip: "Enable termination on channel #6"}}, {type: "Switch", args: {title: "Termination #6", outvar: "term_6", tip: "Enable termination on channel #6"}},
{type: "Switch", args: {title: "Termination #7", fallback: true, outvar: "term_7", tip: "Enable termination on channel #7"}}, {type: "Switch", args: {title: "Termination #7", outvar: "term_7", tip: "Enable termination on channel #7"}},
]}, ]},
null null
] ]
@ -361,10 +361,10 @@ const shop_data = {
"if": [ "if": [
{"!": {"var": "out_first_group"}}, {"!": {"var": "out_first_group"}},
{type: "Group", items: [ {type: "Group", items: [
{type: "Switch", args: {title: "Termination #0", fallback: true, outvar: "term_0", tip: "Enable termination on channel #0"}}, {type: "Switch", args: {title: "Termination #0", outvar: "term_0", tip: "Enable termination on channel #0"}},
{type: "Switch", args: {title: "Termination #1", fallback: true, outvar: "term_1", tip: "Enable termination on channel #1"}}, {type: "Switch", args: {title: "Termination #1", outvar: "term_1", tip: "Enable termination on channel #1"}},
{type: "Switch", args: {title: "Termination #2", fallback: true, outvar: "term_2", tip: "Enable termination on channel #2"}}, {type: "Switch", args: {title: "Termination #2", outvar: "term_2", tip: "Enable termination on channel #2"}},
{type: "Switch", args: {title: "Termination #3", fallback: true, outvar: "term_3", tip: "Enable termination on channel #3"}}, {type: "Switch", args: {title: "Termination #3", outvar: "term_3", tip: "Enable termination on channel #3"}},
]}, ]},
null null
] ]
@ -374,10 +374,10 @@ const shop_data = {
"if": [ "if": [
{"!": {"var": "out_second_group"}}, {"!": {"var": "out_second_group"}},
{type: "Group", items: [ {type: "Group", items: [
{type: "Switch", args: {title: "Termination #4", fallback: true, outvar: "term_4", tip: "Enable termination on channel #4"}}, {type: "Switch", args: {title: "Termination #4", outvar: "term_4", tip: "Enable termination on channel #4"}},
{type: "Switch", args: {title: "Termination #5", fallback: true, outvar: "term_5", tip: "Enable termination on channel #5"}}, {type: "Switch", args: {title: "Termination #5", outvar: "term_5", tip: "Enable termination on channel #5"}},
{type: "Switch", args: {title: "Termination #6", fallback: true, outvar: "term_6", tip: "Enable termination on channel #6"}}, {type: "Switch", args: {title: "Termination #6", outvar: "term_6", tip: "Enable termination on channel #6"}},
{type: "Switch", args: {title: "Termination #7", fallback: true, outvar: "term_7", tip: "Enable termination on channel #7"}}, {type: "Switch", args: {title: "Termination #7", outvar: "term_7", tip: "Enable termination on channel #7"}},
]}, ]},
null null
] ]
@ -432,10 +432,10 @@ const shop_data = {
"if": [ "if": [
{"!": {"var": "out_first_group"}}, {"!": {"var": "out_first_group"}},
{type: "Group", items: [ {type: "Group", items: [
{type: "Switch", args: {title: "Termination #0", fallback: true, outvar: "term_0", tip: "Enable termination on channel #0"}}, {type: "Switch", args: {title: "Termination #0", outvar: "term_0", tip: "Enable termination on channel #0"}},
{type: "Switch", args: {title: "Termination #1", fallback: true, outvar: "term_1", tip: "Enable termination on channel #1"}}, {type: "Switch", args: {title: "Termination #1", outvar: "term_1", tip: "Enable termination on channel #1"}},
{type: "Switch", args: {title: "Termination #2", fallback: true, outvar: "term_2", tip: "Enable termination on channel #2"}}, {type: "Switch", args: {title: "Termination #2", outvar: "term_2", tip: "Enable termination on channel #2"}},
{type: "Switch", args: {title: "Termination #3", fallback: true, outvar: "term_3", tip: "Enable termination on channel #3"}}, {type: "Switch", args: {title: "Termination #3", outvar: "term_3", tip: "Enable termination on channel #3"}},
]}, ]},
null null
] ]
@ -445,10 +445,10 @@ const shop_data = {
"if": [ "if": [
{"!": {"var": "out_second_group"}}, {"!": {"var": "out_second_group"}},
{type: "Group", items: [ {type: "Group", items: [
{type: "Switch", args: {title: "Termination #4", fallback: true, outvar: "term_4", tip: "Enable termination on channel #4"}}, {type: "Switch", args: {title: "Termination #4", outvar: "term_4", tip: "Enable termination on channel #4"}},
{type: "Switch", args: {title: "Termination #5", fallback: true, outvar: "term_5", tip: "Enable termination on channel #5"}}, {type: "Switch", args: {title: "Termination #5", outvar: "term_5", tip: "Enable termination on channel #5"}},
{type: "Switch", args: {title: "Termination #6", fallback: true, outvar: "term_6", tip: "Enable termination on channel #6"}}, {type: "Switch", args: {title: "Termination #6", outvar: "term_6", tip: "Enable termination on channel #6"}},
{type: "Switch", args: {title: "Termination #7", fallback: true, outvar: "term_7", tip: "Enable termination on channel #7"}}, {type: "Switch", args: {title: "Termination #7", outvar: "term_7", tip: "Enable termination on channel #7"}},
]}, ]},
null null
] ]
@ -458,10 +458,10 @@ const shop_data = {
"if": [ "if": [
{"!": {"var": "out_third_group"}}, {"!": {"var": "out_third_group"}},
{type: "Group", items: [ {type: "Group", items: [
{type: "Switch", args: {title: "Termination #8", fallback: true, outvar: "term_8", tip: "Enable termination on channel #8"}}, {type: "Switch", args: {title: "Termination #8", outvar: "term_8", tip: "Enable termination on channel #8"}},
{type: "Switch", args: {title: "Termination #9", fallback: true, outvar: "term_9", tip: "Enable termination on channel #9"}}, {type: "Switch", args: {title: "Termination #9", outvar: "term_9", tip: "Enable termination on channel #9"}},
{type: "Switch", args: {title: "Termination #10", fallback: true, outvar: "term_10", tip: "Enable termination on channel #10"}}, {type: "Switch", args: {title: "Termination #10", outvar: "term_10", tip: "Enable termination on channel #10"}},
{type: "Switch", args: {title: "Termination #11", fallback: true, outvar: "term_11", tip: "Enable termination on channel #11"}}, {type: "Switch", args: {title: "Termination #11", outvar: "term_11", tip: "Enable termination on channel #11"}},
]}, ]},
null null
] ]
@ -471,10 +471,10 @@ const shop_data = {
"if": [ "if": [
{"!": {"var": "out_fourth_group"}}, {"!": {"var": "out_fourth_group"}},
{type: "Group", items: [ {type: "Group", items: [
{type: "Switch", args: {title: "Termination #12", fallback: true, outvar: "term_12", tip: "Enable termination on channel #12"}}, {type: "Switch", args: {title: "Termination #12", outvar: "term_12", tip: "Enable termination on channel #12"}},
{type: "Switch", args: {title: "Termination #13", fallback: true, outvar: "term_13", tip: "Enable termination on channel #13"}}, {type: "Switch", args: {title: "Termination #13", outvar: "term_13", tip: "Enable termination on channel #13"}},
{type: "Switch", args: {title: "Termination #14", fallback: true, outvar: "term_14", tip: "Enable termination on channel #14"}}, {type: "Switch", args: {title: "Termination #14", outvar: "term_14", tip: "Enable termination on channel #14"}},
{type: "Switch", args: {title: "Termination #15", fallback: true, outvar: "term_15", tip: "Enable termination on channel #15"}}, {type: "Switch", args: {title: "Termination #15", outvar: "term_15", tip: "Enable termination on channel #15"}},
]}, ]},
null null
] ]