Add options for the cards #93
|
@ -533,14 +533,19 @@ button {
|
|||
.form-check {
|
||||
min-height: 1rem;
|
||||
}
|
||||
|
||||
&.hd68-idc, &.stabilizer, &.clocker {
|
||||
width: 85px;
|
||||
left: -11px; // (card width (63) - overlay width (85)) / 2
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.overlay-smallcard {
|
||||
right: -38.5px; // (card width (63) - overlay width (140)) / 2
|
||||
left: -38.5px; // (card width (63) - overlay width (140)) / 2
|
||||
}
|
||||
.overlay-bigcard {
|
||||
right: -7px; // (card width (126) - overlay width (140)) / 2
|
||||
left: -7px; // (card width (126) - overlay width (140)) / 2
|
||||
}
|
||||
|
||||
.hovered {
|
||||
|
|
|
@ -705,9 +705,10 @@ class ProductCartItem extends React.PureComponent {
|
|||
) : (options ? (<OptionsDialogPopup
|
||||
options={options}
|
||||
data={options_data}
|
||||
options_class={model.options_class}
|
||||
key={"popover" + index}
|
||||
id={"popover" + index}
|
||||
big={data.size === "big"}
|
||||
big={model.size === "big"}
|
||||
target={{
|
||||
construct: ((outvar, value) => {
|
||||
// console.log("construct", outvar, value, options_data);
|
||||
|
|
|
@ -318,7 +318,7 @@ export function FilterOptions(options, data) {
|
|||
return target
|
||||
}
|
||||
|
||||
export function OptionsDialogPopup({options, data, target, id, big}) {
|
||||
export function OptionsDialogPopup({options, data, target, id, big, options_class}) {
|
||||
const [show, setShow] = useState(false);
|
||||
const ref = useClickAway((e) => {
|
||||
if (e.type === "mousedown") // ignore touchstart
|
||||
|
@ -326,7 +326,7 @@ export function OptionsDialogPopup({options, data, target, id, big}) {
|
|||
}
|
||||
);
|
||||
|
||||
let div_classes = "overlayVariant border rounded " + (big ? "overlay-bigcard" : "overlay-smallcard")
|
||||
let div_classes = "overlayVariant border rounded " + (big ? "overlay-bigcard " : "overlay-smallcard ") + (options_class || "");
|
||||
const handleClick = (event) => {
|
||||
setShow(!show);
|
||||
};
|
||||
|
@ -444,7 +444,7 @@ export function OptionsSummaryPopup({id, options, data}) {
|
|||
export function FillExtData(data, index) {
|
||||
return {
|
||||
has_previous_carrier: data.filter((value, item_index) => index > item_index && value.name === "Carrier").length > 0,
|
||||
has_other_dio: data.filter((value, item_index) => index !== item_index && value.name.endsWith("-TTL")).length > 0,
|
||||
has_other_dio: data.filter((value, item_index) => index !== item_index && value.name &&value.name.endsWith("-TTL")).length > 0,
|
||||
has_dds: data.filter(((value, _) => value.name === "DDS" && (!value.options_data || !value.options_data.mono_eem))).length > 0,
|
||||
has_sampler: data.filter(((value, _) => value.name === "Sampler" && (!value.options_data || !value.options_data.mono_eem))).length > 0,
|
||||
}
|
||||
|
|
|
@ -833,6 +833,10 @@ const shop_data = {
|
|||
size: 'small',
|
||||
type: 'hd68',
|
||||
hp: 4,
|
||||
options: [
|
||||
{type: "Radio", args: {title: "Cable length", outvar: "hd68_cable_len", variants: ["1 M", "2 M", "3 M"], tip: "The desired length of the HD68 cable", fallback: 1}},
|
||||
],
|
||||
options_class: "hd68-idc",
|
||||
nbrSlotMin: 1,
|
||||
nbrSlotMax: 4,
|
||||
nbrCurrentSlot: 0,
|
||||
|
@ -955,6 +959,7 @@ const shop_data = {
|
|||
{type: "Switch", args: {title: "Ext CLK", outvar: "ext_clk"}},
|
||||
{type: "Switch", args: {title: "Ext power", outvar: "ext_pwr", "tip": "Use external power supply in order to reduce number of used EEM connectors"}}
|
||||
],
|
||||
options_class: "clocker",
|
||||
size: 'small',
|
||||
type: 'clocker',
|
||||
hp: 4,
|
||||
|
@ -996,6 +1001,7 @@ const shop_data = {
|
|||
options: [
|
||||
{type: "Switch", args: {title: "Ext power", outvar: "ext_pwr", "tip": "Use external power supply in order to reduce number of used EEM connectors"}}
|
||||
],
|
||||
options_class: "stabilizer",
|
||||
size: 'small',
|
||||
type: null,
|
||||
hp: 4,
|
||||
|
|
Loading…
Reference in New Issue