Add options for the cards #93
File diff suppressed because it is too large
Load Diff
18
package.json
18
package.json
|
|
@ -12,25 +12,25 @@
|
|||
"url": "https://git.m-labs.hk/M-Labs/web2019.git"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@babel/cli": "^7.22.6",
|
||||
"@babel/core": "^7.22.8",
|
||||
"@babel/preset-env": "^7.22.7",
|
||||
"@babel/preset-react": "^7.22.5",
|
||||
"axios": "^1.4.0",
|
||||
"@babel/cli": "^7.23.0",
|
||||
"@babel/core": "^7.23.2",
|
||||
"@babel/preset-env": "^7.23.2",
|
||||
"@babel/preset-react": "^7.22.15",
|
||||
"axios": "^1.6.0",
|
||||
"babel-loader": "^9.1.3",
|
||||
"babel-preset-minify": "^0.5.2",
|
||||
"bootstrap": "^5.3.0",
|
||||
"jquery": "^3.7.0",
|
||||
"prop-types": "^15.8.1",
|
||||
"react": "^18.2.0",
|
||||
"react-bootstrap": "^2.8.0",
|
||||
"react-bootstrap": "^2.9.1",
|
||||
"react-beautiful-dnd": "^13.1.1",
|
||||
"react-dom": "^18.2.0",
|
||||
"uuid": "^9.0.0",
|
||||
"webpack": "^5.88.1",
|
||||
"uuid": "^9.0.1",
|
||||
"webpack": "^5.89.0",
|
||||
"webpack-cli": "^5.1.4",
|
||||
"json-logic-js": "^2.0.2",
|
||||
"@uidotdev/usehooks": "^2.1.1"
|
||||
"@uidotdev/usehooks": "^2.4.1"
|
||||
},
|
||||
"babel": {
|
||||
"presets": [
|
||||
|
|
|
|||
File diff suppressed because one or more lines are too long
|
|
@ -6,7 +6,8 @@ import { createRoot } from "react-dom/client";
|
|||
import PropTypes from "prop-types";
|
||||
import { DragDropContext, Droppable, Draggable } from "react-beautiful-dnd";
|
||||
import { v4 as uuidv4 } from 'uuid';
|
||||
import { OptionsDialogPopup, OptionsSummaryPopup, FilterOptions, FillExtData } from "./shop_components.jsx";import { OverlayTrigger } from "react-bootstrap";
|
||||
import { OptionsDialogPopup, OptionsSummaryPopup, FilterOptions, FillExtData } from "./shop_components.jsx";
|
||||
import { OverlayTrigger } from "react-bootstrap";
|
||||
|
||||
const data = window.shop_data;
|
||||
const itemsUnfoldedList = Array.from(data.columns.backlog.categories.map(groupId => groupId.itemIds).flat());
|
||||
|
|
@ -619,37 +620,23 @@ class ProductCartItem extends React.PureComponent {
|
|||
if (data) {
|
||||
switch(model.type) {
|
||||
case 'kasli':
|
||||
render_progress = (
|
||||
<div className="k-popup-connectors">
|
||||
<p>{`${data.nbrCurrentSlot}/${model.nbrSlotMax} EEM connectors used`}</p>
|
||||
<p>{`${data.nbrCurrentClock}/${model.nbrClockMax} Clock connectors used`}</p>
|
||||
</div>
|
||||
);
|
||||
render_progress = [
|
||||
(<p key={model.type+model.id+"EEM"}>{`${data.nbrCurrentSlot}/${model.nbrSlotMax} EEM connectors used`}</p>),
|
||||
(<p key={model.type+model.id+"CLK"}>{`${data.nbrCurrentClock}/${model.nbrClockMax} Clock connectors used`}</p>)
|
||||
];
|
||||
break;
|
||||
|
||||
case 'vhdcicarrier':
|
||||
render_progress = (
|
||||
<div className="k-popup-connectors">
|
||||
<p>{`${data.nbrCurrentSlot}/${model.nbrSlotMax} EEM connectors used`}</p>
|
||||
</div>
|
||||
);
|
||||
render_progress = (<p>{`${data.nbrCurrentSlot}/${model.nbrSlotMax} EEM connectors used`}</p>);
|
||||
break;
|
||||
|
||||
case 'zotino':
|
||||
case 'hd68':
|
||||
render_progress = (
|
||||
<div className="k-popup-connectors">
|
||||
<p>{`${data.nbrCurrentSlot}/${model.nbrSlotMax} connectors used`}</p>
|
||||
</div>
|
||||
);
|
||||
render_progress = (<p>{`${data.nbrCurrentSlot}/${model.nbrSlotMax} connectors used`}</p>);
|
||||
break;
|
||||
|
||||
case 'clocker':
|
||||
render_progress = (
|
||||
<div className="k-popup-connectors">
|
||||
<p>{`${data.nbrCurrentClock}/${model.nbrClockMax} Clock connectors used`}</p>
|
||||
</div>
|
||||
);
|
||||
render_progress = (<p>{`${data.nbrCurrentClock}/${model.nbrClockMax} Clock connectors used`}</p>);
|
||||
break;
|
||||
|
||||
default:
|
||||
|
|
@ -679,59 +666,45 @@ class ProductCartItem extends React.PureComponent {
|
|||
|
||||
{/* warning container */}
|
||||
<OverlayTrigger
|
||||
placement="bottom"
|
||||
trigger={warning ? ['click', 'hover', 'focus'] : []}
|
||||
overlay={
|
||||
warning ? (<div className="k-popup-warning">
|
||||
<p className="rule warning">
|
||||
<i>{warning.message}</i>
|
||||
</p>
|
||||
</div>) : null
|
||||
}
|
||||
rootClose
|
||||
>
|
||||
<div className="progress-container warning">
|
||||
{warning && (<img className="alert-warning" src={warning ? `/images${warning.icon}` : null}/>)}
|
||||
</div>
|
||||
</OverlayTrigger>
|
||||
|
||||
<div
|
||||
className="progress-container warning"
|
||||
onMouseEnter={this.handleOnMouseEnterWarningItem.bind(this, index, warning)}
|
||||
onMouseLeave={this.handleOnMouseLeaveWarningItem.bind(this, index, warning)}>
|
||||
|
||||
{warning ? (
|
||||
<img className="alert-warning" src={`/images${warning.icon}`} />
|
||||
) : (options ? (<OptionsDialogPopup
|
||||
options={options}
|
||||
data={options_data}
|
||||
options_class={model.options_class}
|
||||
key={"popover" + index}
|
||||
id={"popover" + index}
|
||||
big={model.size === "big"}
|
||||
target={{
|
||||
construct: ((outvar, value) => {
|
||||
// console.log("construct", outvar, value, options_data);
|
||||
options_data[outvar] = value;
|
||||
}),
|
||||
update: ((outvar, value) => {
|
||||
// console.log("update", outvar, value, options_data);
|
||||
if (outvar in options_data) options_data[outvar] = value;
|
||||
onCardUpdate();
|
||||
})
|
||||
}}
|
||||
/>) : null) }
|
||||
|
||||
|
||||
|
||||
{warning && model.showWarning && (
|
||||
<div className={`k-popup-warning ${shouldTooltipWarningClassInverted ? 'inverted': ''}`}>
|
||||
placement="bottom"
|
||||
trigger={warning ? ['click', 'hover', 'focus'] : []}
|
||||
overlay={
|
||||
({arrowProps, hasDoneInitialMeasure, show, ...props}) => (
|
||||
<div className="k-popup-warning" {...props}>
|
||||
<p className="rule warning">
|
||||
<i>{warning.message}</i>
|
||||
</p>
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
</div>)
|
||||
}
|
||||
rootClose
|
||||
>
|
||||
<div className="progress-container warning">
|
||||
{warning ?
|
||||
(<img className="alert-warning" src={warning ? `/images${warning.icon}` : null}/>) :
|
||||
(options && (
|
||||
<OptionsDialogPopup
|
||||
options={options}
|
||||
data={options_data}
|
||||
options_class={model.options_class}
|
||||
key={"popover" + index}
|
||||
id={"popover" + index}
|
||||
big={model.size === "big"}
|
||||
target={{
|
||||
construct: ((outvar, value) => {
|
||||
// console.log("construct", outvar, value, options_data);
|
||||
options_data[outvar] = value;
|
||||
}),
|
||||
update: ((outvar, value) => {
|
||||
// console.log("update", outvar, value, options_data);
|
||||
if (outvar in options_data) options_data[outvar] = value;
|
||||
onCardUpdate();
|
||||
})
|
||||
}}
|
||||
/>
|
||||
))
|
||||
}
|
||||
</div>
|
||||
</OverlayTrigger>
|
||||
|
||||
<h6>{model.name_number}</h6>
|
||||
|
||||
|
|
@ -761,7 +734,7 @@ class ProductCartItem extends React.PureComponent {
|
|||
<OverlayTrigger
|
||||
placement="top"
|
||||
trigger={['click', 'hover', 'focus']}
|
||||
overlay={render_progress}
|
||||
overlay={({arrowProps, hasDoneInitialMeasure, show, ...props}) => (<div className="k-popup-connectors" {...props}>{render_progress}</div>)}
|
||||
rootClose
|
||||
>
|
||||
<div className="progress-container">
|
||||
|
|
@ -2451,8 +2424,7 @@ class Shop extends React.PureComponent {
|
|||
itemHovered={currentItemHovered}
|
||||
onToggleOverlayRemove={this.handleToggleOverlayRemove}
|
||||
onClickRemoveItem={this.handleDeleteItem}
|
||||
onClickItem={this.handleShowOverlayRemove}>
|
||||
onClickRemoveItem={this.handleDeleteItem}
|
||||
onClickItem={this.handleShowOverlayRemove}
|
||||
onCardUpdate={this.handleCardsUpdated}>
|
||||
</Cart>
|
||||
}
|
||||
|
|
|
|||
Loading…
Reference in New Issue