Compare commits
37 Commits
851b9014fb
...
6596ba0f77
Author | SHA1 | Date |
---|---|---|
Egor Savkin | 6596ba0f77 | |
Egor Savkin | a72684332e | |
Egor Savkin | 3d5b2e4439 | |
Egor Savkin | 37ced5ad9c | |
Egor Savkin | 2bef354083 | |
Egor Savkin | f494d4c316 | |
Egor Savkin | 0e490dc196 | |
Egor Savkin | 777ea5b054 | |
Egor Savkin | fe9c70efd3 | |
Egor Savkin | f279bdbc58 | |
Egor Savkin | b3c4110ceb | |
Egor Savkin | e214827c71 | |
Egor Savkin | 5f848e84d3 | |
Egor Savkin | cf8db4726d | |
Egor Savkin | 6af84b3797 | |
Egor Savkin | ca6b1370b4 | |
Egor Savkin | f126430911 | |
Egor Savkin | 844f390b50 | |
Egor Savkin | e32aa93f86 | |
Egor Savkin | 3995cc8b98 | |
Egor Savkin | 2f13b6c295 | |
Egor Savkin | 8352336447 | |
Egor Savkin | f7bb485a86 | |
Egor Savkin | 02de69b6de | |
Egor Savkin | 30e0ef7d04 | |
Egor Savkin | ececcbd3b2 | |
Egor Savkin | 25195ca547 | |
Egor Savkin | c342791a58 | |
Egor Savkin | 3aa2c86b64 | |
Egor Savkin | 3638e9fdcd | |
Egor Savkin | 7ea515edcc | |
Egor Savkin | fac0ae43bb | |
Egor Savkin | 1d43cbc21f | |
Egor Savkin | cea4c74e52 | |
Egor Savkin | 2df40fc222 | |
Egor Savkin | cca2a721ad | |
Egor Savkin | 784cacb1f8 |
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.23.0",
|
||||
"@babel/core": "^7.23.2",
|
||||
"@babel/preset-env": "^7.23.2",
|
||||
"@babel/preset-react": "^7.22.15",
|
||||
"axios": "^1.6.0",
|
||||
"@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-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.9.1",
|
||||
"react-bootstrap": "^2.8.0",
|
||||
"react-beautiful-dnd": "^13.1.1",
|
||||
"react-dom": "^18.2.0",
|
||||
"uuid": "^9.0.1",
|
||||
"webpack": "^5.89.0",
|
||||
"uuid": "^9.0.0",
|
||||
"webpack": "^5.88.1",
|
||||
"webpack-cli": "^5.1.4",
|
||||
"json-logic-js": "^2.0.2",
|
||||
"@uidotdev/usehooks": "^2.4.1"
|
||||
"@uidotdev/usehooks": "^2.1.1"
|
||||
},
|
||||
"babel": {
|
||||
"presets": [
|
||||
|
|
|
@ -461,6 +461,50 @@ button {
|
|||
width: 20px;
|
||||
padding-bottom: 3px;
|
||||
}
|
||||
|
||||
.k-popup-connectors,
|
||||
.k-popup-warning {
|
||||
position: absolute;
|
||||
background-color: $color-primary;
|
||||
color: white;
|
||||
font-weight: 700;
|
||||
font-size: .6rem;
|
||||
padding: .8rem 1rem;
|
||||
box-shadow: 0 0.5rem 1rem rgba(0,0,0,0.15);
|
||||
text-align: left;
|
||||
|
||||
p {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
p + p {
|
||||
padding-bottom: 8px;
|
||||
}
|
||||
}
|
||||
|
||||
.k-popup-connectors {
|
||||
min-width: 200px;
|
||||
bottom: 50px;
|
||||
}
|
||||
|
||||
.k-popup-warning {
|
||||
background-color: #c75e5e;
|
||||
min-width: 350px;
|
||||
|
||||
.rule.warning {
|
||||
display: flex;
|
||||
font-size: .75rem;
|
||||
|
||||
img {
|
||||
margin-right: 10px;
|
||||
height: 100%;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.k-popup-warning.inverted {
|
||||
right: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.overlayRemove {
|
||||
|
@ -589,42 +633,3 @@ button {
|
|||
}
|
||||
|
||||
}
|
||||
|
||||
.k-popup-connectors,
|
||||
.k-popup-warning {
|
||||
background-color: $color-primary;
|
||||
color: white;
|
||||
font-weight: 700;
|
||||
font-size: .6rem;
|
||||
padding: .8rem 1rem;
|
||||
box-shadow: 0 0.5rem 1rem rgba(0,0,0,0.15);
|
||||
text-align: left;
|
||||
|
||||
p {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
p + p {
|
||||
padding-bottom: 8px;
|
||||
}
|
||||
}
|
||||
|
||||
.k-popup-connectors {
|
||||
min-width: 200px;
|
||||
}
|
||||
|
||||
.k-popup-warning {
|
||||
background-color: #c75e5e;
|
||||
min-width: 300px;
|
||||
|
||||
.rule.warning {
|
||||
display: flex;
|
||||
font-size: .75rem;
|
||||
|
||||
img {
|
||||
margin-right: 10px;
|
||||
height: 100%;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
|
File diff suppressed because one or more lines are too long
|
@ -7,7 +7,6 @@ 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";
|
||||
|
||||
const data = window.shop_data;
|
||||
const itemsUnfoldedList = Array.from(data.columns.backlog.categories.map(groupId => groupId.itemIds).flat());
|
||||
|
@ -534,16 +533,17 @@ class ProductCartItem extends React.PureComponent {
|
|||
static get propTypes() {
|
||||
return {
|
||||
isMobile: PropTypes.bool,
|
||||
isTouch: PropTypes.bool,
|
||||
hovered: PropTypes.bool,
|
||||
index: PropTypes.number.isRequired,
|
||||
model: PropTypes.object.isRequired,
|
||||
data: PropTypes.object,
|
||||
ext_data: PropTypes.object,
|
||||
onToggleProgress: PropTypes.func,
|
||||
onToggleWarning: PropTypes.func,
|
||||
onToggleOverlayRemove: PropTypes.func,
|
||||
onClickRemoveItem: PropTypes.func,
|
||||
onClickItem: PropTypes.func,
|
||||
onCardUpdate: PropTypes.func,
|
||||
shouldTooltipWarningClassInverted: PropTypes.bool,
|
||||
};
|
||||
}
|
||||
|
||||
|
@ -555,10 +555,47 @@ class ProductCartItem extends React.PureComponent {
|
|||
|
||||
constructor(props) {
|
||||
super(props);
|
||||
this.handleOnMouseEnterItem = this.handleOnMouseEnterItem.bind(this);
|
||||
this.handleOnMouseLeaveItem = this.handleOnMouseLeaveItem.bind(this);
|
||||
this.handleOnMouseEnterWarningItem = this.handleOnMouseEnterWarningItem.bind(this);
|
||||
this.handleOnMouseLeaveWarningItem = this.handleOnMouseLeaveWarningItem.bind(this);
|
||||
this.handleOnMouseEnterRemoveItem = this.handleOnMouseEnterRemoveItem.bind(this);
|
||||
this.handleOnMouseLeaveRemoveItem = this.handleOnMouseLeaveRemoveItem.bind(this);
|
||||
this.handleOnClickRemoveItem = this.handleOnClickRemoveItem.bind(this);
|
||||
this.handleOnClickItem = this.handleOnClickItem.bind(this);
|
||||
}
|
||||
|
||||
handleOnMouseEnterItem(index, e) {
|
||||
if (this.props.onToggleProgress) {
|
||||
this.props.onToggleProgress(index, true);
|
||||
}
|
||||
e.preventDefault();
|
||||
}
|
||||
|
||||
handleOnMouseLeaveItem(index, e) {
|
||||
if (this.props.onToggleProgress) {
|
||||
this.props.onToggleProgress(index, false);
|
||||
}
|
||||
e.preventDefault();
|
||||
}
|
||||
|
||||
handleOnMouseEnterWarningItem(index, isWarning, e) {
|
||||
if (!isWarning) {
|
||||
return;
|
||||
}
|
||||
if (this.props.onToggleWarning) {
|
||||
this.props.onToggleWarning(index, true);
|
||||
}
|
||||
e.preventDefault();
|
||||
}
|
||||
|
||||
handleOnMouseLeaveWarningItem(index, isWarning, e) {
|
||||
if (!isWarning) {
|
||||
return;
|
||||
}
|
||||
if (this.props.onToggleWarning) {
|
||||
this.props.onToggleWarning(index, false);
|
||||
}
|
||||
e.preventDefault();
|
||||
}
|
||||
|
||||
handleOnMouseEnterRemoveItem(index, e) {
|
||||
|
@ -575,13 +612,6 @@ class ProductCartItem extends React.PureComponent {
|
|||
e.preventDefault();
|
||||
}
|
||||
|
||||
handleOnClickItem(index, e) {
|
||||
if (this.props.onClickItem && this.props.isTouch) {
|
||||
this.props.onClickItem(index);
|
||||
}
|
||||
e.preventDefault();
|
||||
}
|
||||
|
||||
handleOnClickRemoveItem(index, e) {
|
||||
if (this.props.onClickRemoveItem) {
|
||||
this.props.onClickRemoveItem(index);
|
||||
|
@ -595,6 +625,7 @@ class ProductCartItem extends React.PureComponent {
|
|||
data,
|
||||
index,
|
||||
ext_data,
|
||||
shouldTooltipWarningClassInverted,
|
||||
onCardUpdate,
|
||||
} = this.props;
|
||||
|
||||
|
@ -617,26 +648,40 @@ class ProductCartItem extends React.PureComponent {
|
|||
}
|
||||
|
||||
let render_progress;
|
||||
if (data) {
|
||||
if (model.showProgress && data) {
|
||||
switch(model.type) {
|
||||
case 'kasli':
|
||||
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>)
|
||||
];
|
||||
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>
|
||||
);
|
||||
break;
|
||||
|
||||
case 'vhdcicarrier':
|
||||
render_progress = (<p>{`${data.nbrCurrentSlot}/${model.nbrSlotMax} EEM connectors used`}</p>);
|
||||
render_progress = (
|
||||
<div className="k-popup-connectors">
|
||||
<p>{`${data.nbrCurrentSlot}/${model.nbrSlotMax} EEM connectors used`}</p>
|
||||
</div>
|
||||
);
|
||||
break;
|
||||
|
||||
case 'zotino':
|
||||
case 'hd68':
|
||||
render_progress = (<p>{`${data.nbrCurrentSlot}/${model.nbrSlotMax} connectors used`}</p>);
|
||||
render_progress = (
|
||||
<div className="k-popup-connectors">
|
||||
<p>{`${data.nbrCurrentSlot}/${model.nbrSlotMax} connectors used`}</p>
|
||||
</div>
|
||||
);
|
||||
break;
|
||||
|
||||
case 'clocker':
|
||||
render_progress = (<p>{`${data.nbrCurrentClock}/${model.nbrClockMax} Clock connectors used`}</p>);
|
||||
render_progress = (
|
||||
<div className="k-popup-connectors">
|
||||
<p>{`${data.nbrCurrentClock}/${model.nbrClockMax} Clock connectors used`}</p>
|
||||
</div>
|
||||
);
|
||||
break;
|
||||
|
||||
default:
|
||||
|
@ -665,52 +710,48 @@ class ProductCartItem extends React.PureComponent {
|
|||
>
|
||||
|
||||
{/* warning container */}
|
||||
<OverlayTrigger
|
||||
placement="bottom"
|
||||
trigger={warning ? ['click', 'hover', 'focus'] : []}
|
||||
overlay={
|
||||
({arrowProps, hasDoneInitialMeasure, show, ...props}) => (
|
||||
<div className="k-popup-warning" {...props}>
|
||||
<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': ''}`}>
|
||||
<p className="rule warning">
|
||||
<i>{warning.message}</i>
|
||||
</p>
|
||||
</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>
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
|
||||
<h6>{model.name_number}</h6>
|
||||
|
||||
<div
|
||||
onMouseEnter={this.handleOnMouseEnterRemoveItem.bind(this, index)}
|
||||
onClick={this.handleOnClickItem.bind(this, index)}
|
||||
>
|
||||
|
||||
<img
|
||||
|
@ -730,30 +771,26 @@ class ProductCartItem extends React.PureComponent {
|
|||
</div>
|
||||
|
||||
{/* progression container */}
|
||||
{render_progress && (
|
||||
<OverlayTrigger
|
||||
placement="top"
|
||||
trigger={['click', 'hover', 'focus']}
|
||||
overlay={({arrowProps, hasDoneInitialMeasure, show, ...props}) => (<div className="k-popup-connectors" {...props}>{render_progress}</div>)}
|
||||
rootClose
|
||||
>
|
||||
<div className="progress-container">
|
||||
<div
|
||||
className="progress-container"
|
||||
onMouseEnter={this.handleOnMouseEnterItem.bind(this, index)}
|
||||
onMouseLeave={this.handleOnMouseLeaveItem.bind(this, index)}>
|
||||
|
||||
{model.nbrSlotMax > 0 && (
|
||||
<div className="nbr-connectors">
|
||||
<div style={{ ...nbrConnectorsStyle(data)}}></div>
|
||||
</div>
|
||||
)}
|
||||
|
||||
{model.nbrClockMax > 0 && (
|
||||
<div className="nbr-clocks">
|
||||
<div style={{ ...nbrClocksStyle(data)}}></div>
|
||||
</div>
|
||||
)}
|
||||
{model.nbrSlotMax > 0 && (
|
||||
<div className="nbr-connectors">
|
||||
<div style={{ ...nbrConnectorsStyle(data)}}></div>
|
||||
</div>
|
||||
</OverlayTrigger>
|
||||
)}
|
||||
)}
|
||||
|
||||
{model.nbrClockMax > 0 && (
|
||||
<div className="nbr-clocks">
|
||||
<div style={{ ...nbrClocksStyle(data)}}></div>
|
||||
</div>
|
||||
)}
|
||||
|
||||
{/* progress info when mouse over */}
|
||||
{render_progress}
|
||||
</div>
|
||||
|
||||
</div>
|
||||
)}
|
||||
|
@ -817,30 +854,34 @@ class Cart extends React.PureComponent {
|
|||
static get propTypes() {
|
||||
return {
|
||||
isMobile: PropTypes.bool,
|
||||
isTouch: PropTypes.bool,
|
||||
nbrSlots: PropTypes.number,
|
||||
itemHovered: PropTypes.string,
|
||||
data: PropTypes.object.isRequired,
|
||||
onToggleProgress: PropTypes.func,
|
||||
onToggleWarning: PropTypes.func,
|
||||
onToggleOverlayRemove: PropTypes.func,
|
||||
onClickRemoveItem: PropTypes.func,
|
||||
onCardUpdate: PropTypes.func,
|
||||
onClickItem: PropTypes.func,
|
||||
};
|
||||
}
|
||||
|
||||
render() {
|
||||
const {
|
||||
isMobile,
|
||||
isTouch,
|
||||
nbrSlots,
|
||||
itemHovered,
|
||||
data,
|
||||
onToggleProgress,
|
||||
onToggleWarning,
|
||||
onToggleOverlayRemove,
|
||||
onClickRemoveItem,
|
||||
onClickItem,
|
||||
onCardUpdate,
|
||||
} = this.props;
|
||||
|
||||
const nbrOccupied = nbrOccupiedSlotsInCrate(data.items);
|
||||
|
||||
const shouldTooltipWarningClassInverted = nbrSlots - nbrOccupied < 5;
|
||||
|
||||
const products = data.items.map((item, index) => {
|
||||
let itemData;
|
||||
let ext_data = FillExtData(data.itemsData, index);
|
||||
|
@ -851,17 +892,18 @@ class Cart extends React.PureComponent {
|
|||
return (
|
||||
<ProductCartItem
|
||||
isMobile={isMobile}
|
||||
isTouch={isTouch}
|
||||
hovered={item.id === itemHovered}
|
||||
key={item.id}
|
||||
id={item.id}
|
||||
index={index}
|
||||
data={itemData}
|
||||
ext_data={ext_data}
|
||||
shouldTooltipWarningClassInverted={shouldTooltipWarningClassInverted && index > 10}
|
||||
onToggleProgress={onToggleProgress}
|
||||
onToggleWarning={onToggleWarning}
|
||||
onToggleOverlayRemove={onToggleOverlayRemove}
|
||||
onClickRemoveItem={onClickRemoveItem}
|
||||
onCardUpdate={onCardUpdate}
|
||||
onClickItem={onClickItem}
|
||||
model={item}>
|
||||
</ProductCartItem>
|
||||
);
|
||||
|
@ -1260,7 +1302,7 @@ class OrderForm extends React.PureComponent {
|
|||
|
||||
<textarea
|
||||
onChange={handleNote}
|
||||
defaultValue={note}
|
||||
value={note}
|
||||
rows="5"
|
||||
placeholder="Additional notes" />
|
||||
|
||||
|
@ -1268,7 +1310,7 @@ class OrderForm extends React.PureComponent {
|
|||
<input
|
||||
className="btn btn-outline-primary w-100 m-0 mb-2 mb-sm-0 me-sm-2"
|
||||
style={{'cursor': 'pointer', 'fontWeight': '700'}}
|
||||
defaultValue="Show JSON"
|
||||
value="Show JSON"
|
||||
onClick={onClickShow}
|
||||
readOnly={true} />
|
||||
|
||||
|
@ -1623,10 +1665,11 @@ class Shop extends React.PureComponent {
|
|||
this.handleMouseLeaveItem = this.handleMouseLeaveItem.bind(this);
|
||||
this.handleClickAddItem = this.handleClickAddItem.bind(this);
|
||||
this.checkAlerts = this.checkAlerts.bind(this);
|
||||
this.handleToggleItemProgress = this.handleToggleItemProgress.bind(this);
|
||||
this.handleToggleItemWarning = this.handleToggleItemWarning.bind(this);
|
||||
this.handleClickSelectItem = this.handleClickSelectItem.bind(this);
|
||||
this.handleClickSubmit = this.handleClickSubmit.bind(this);
|
||||
this.handleToggleOverlayRemove = this.handleToggleOverlayRemove.bind(this);
|
||||
this.handleShowOverlayRemove = this.handleShowOverlayRemove.bind(this);
|
||||
this.handleClickToggleMobileSideMenu = this.handleClickToggleMobileSideMenu.bind(this);
|
||||
this.handleClickCloseRFQFeedback = this.handleClickCloseRFQFeedback.bind(this);
|
||||
this.handleClickShowOrder = this.handleClickShowOrder.bind(this);
|
||||
|
@ -1635,7 +1678,6 @@ class Shop extends React.PureComponent {
|
|||
this.handleCardsUpdated = this.handleCardsUpdated.bind(this);
|
||||
|
||||
this.timer = null;
|
||||
this.timer_remove = null;
|
||||
}
|
||||
|
||||
componentDidMount() {
|
||||
|
@ -1759,6 +1801,50 @@ class Shop extends React.PureComponent {
|
|||
}, tap);
|
||||
}
|
||||
|
||||
handleToggleItemProgress(index, show) {
|
||||
const itemsCloned = Array.from(this.state.columns.cart.items);
|
||||
|
||||
this.setState({
|
||||
...this.state,
|
||||
columns: {
|
||||
...this.state.columns,
|
||||
cart: {
|
||||
...this.state.columns.cart,
|
||||
items: itemsCloned.map((item, i) => {
|
||||
return {
|
||||
...item,
|
||||
showProgress: i === index ? show : false,
|
||||
showOverlayRemove: false,
|
||||
showWarning: false,
|
||||
};
|
||||
}),
|
||||
}
|
||||
},
|
||||
});
|
||||
}
|
||||
|
||||
handleToggleItemWarning(index, show) {
|
||||
const itemsCloned = Array.from(this.state.columns.cart.items);
|
||||
|
||||
this.setState({
|
||||
...this.state,
|
||||
columns: {
|
||||
...this.state.columns,
|
||||
cart: {
|
||||
...this.state.columns.cart,
|
||||
items: itemsCloned.map((item, i) => {
|
||||
return {
|
||||
...item,
|
||||
showWarning: i === index ? show : false,
|
||||
showProgress: false,
|
||||
showOverlayRemove: false,
|
||||
};
|
||||
}),
|
||||
}
|
||||
},
|
||||
});
|
||||
}
|
||||
|
||||
handleClickSelectItem(index) {
|
||||
const itemsCloned = Array.from(this.state.columns.cart.items);
|
||||
|
||||
|
@ -1788,7 +1874,9 @@ class Shop extends React.PureComponent {
|
|||
items: itemsCloned.map((item, id) => {
|
||||
return {
|
||||
...item,
|
||||
showOverlayRemove: id === index ? show : false
|
||||
showOverlayRemove: id === index ? show : false,
|
||||
showProgress: false,
|
||||
showWarning: false,
|
||||
};
|
||||
}),
|
||||
}
|
||||
|
@ -1796,17 +1884,6 @@ class Shop extends React.PureComponent {
|
|||
});
|
||||
}
|
||||
|
||||
handleShowOverlayRemove(index) {
|
||||
if (this.timer_remove)
|
||||
clearTimeout(this.timer_remove);
|
||||
|
||||
this.handleToggleOverlayRemove(index, true);
|
||||
|
||||
this.timer_remove = setTimeout(() => {
|
||||
this.handleToggleOverlayRemove(index, false);
|
||||
}, 2000);
|
||||
}
|
||||
|
||||
handleClickShowOrder() {
|
||||
const crate = {
|
||||
items: [],
|
||||
|
@ -2372,7 +2449,6 @@ class Shop extends React.PureComponent {
|
|||
} = this.state;
|
||||
|
||||
const isMobile = window.deviceIsMobile();
|
||||
const isTouch = window.isTouchEnabled();
|
||||
|
||||
return (
|
||||
<DragDropContext onDragEnd={this.handleOnDragEnd}>
|
||||
|
@ -2420,11 +2496,11 @@ class Shop extends React.PureComponent {
|
|||
nbrSlots={crateModeSlots[currentMode]}
|
||||
data={columns['cart']}
|
||||
isMobile={isMobile}
|
||||
isTouch={isTouch}
|
||||
itemHovered={currentItemHovered}
|
||||
onToggleProgress={this.handleToggleItemProgress}
|
||||
onToggleWarning={this.handleToggleItemWarning}
|
||||
onToggleOverlayRemove={this.handleToggleOverlayRemove}
|
||||
onClickRemoveItem={this.handleDeleteItem}
|
||||
onClickItem={this.handleShowOverlayRemove}
|
||||
onCardUpdate={this.handleCardsUpdated}>
|
||||
</Cart>
|
||||
}
|
||||
|
|
|
@ -31,15 +31,7 @@
|
|||
return window.innerWidth < 768;
|
||||
}
|
||||
|
||||
function isTouchEnabled() {
|
||||
return ('ontouchstart' in window) ||
|
||||
(navigator.maxTouchPoints > 0) ||
|
||||
(navigator.msMaxTouchPoints > 0);
|
||||
}
|
||||
|
||||
|
||||
window.deviceIsMobile = deviceIsMobile;
|
||||
window.isTouchEnabled = isTouchEnabled;
|
||||
})();
|
||||
</script>
|
||||
|
||||
|
|
Loading…
Reference in New Issue