M-Labs
/
web2019
5
0
Fork 2
Code Issues 16 Pull Requests Releases Wiki Activity

Combine warning and options iconed buttons in one line 

Signed-off-by: Egor Savkin <es@m-labs.hk>
pull/93/head
Egor Savkin 2023-11-27 17:12:22 +08:00
parent b7087711aa
commit 38541f8928
4 changed files with 51 additions and 48 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
sass/css/_shop.scss
View File

@ -255,13 +255,10 @@ button {
.item-card-name,
.price {
> .alert-warning, .alert-info {
.alert-warning, .alert-info {
background-color: inherit;
height: inherit;
width: 20px;
padding-bottom: 3px;
}
.alert-info {
padding-bottom: 0;
}
}

2
static/js/shop.bundle.js
View File

File diff suppressed because one or more lines are too long

91
static/js/shop.jsx
View File

@ -655,8 +655,8 @@ class ProductCartItem extends React.PureComponent {
provided.draggableProps.style,
snapshot,
true,
hovered ? true : false,
model.selected ? true : false,
!!hovered,
!!model.selected,
true
)}}
onMouseEnter={this.handleOnMouseEnterRemoveItem.bind(this, index)}
@ -664,24 +664,28 @@ 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}>
<p className="rule warning">
<i>{warning.message}</i>
</p>
</div>)
<div className="progress-container warning d-flex justify-content-evenly">
{warning &&
(<OverlayTrigger
placement="bottom"
trigger={['click', 'hover', 'focus']}
overlay={
({arrowProps, hasDoneInitialMeasure, show, ...props}) => (
<div className="k-popup-warning" {...props}>
<p className="rule warning">
<i>{warning.message}</i>
</p>
</div>)
}
rootClose
>
<img className="alert-warning" src={`/images${warning.icon}`}/>
</OverlayTrigger>)
}
rootClose
>
<div className="progress-container warning">
{warning ?
(<img className="alert-warning" src={warning ? `/images${warning.icon}` : null}/>) :
(options && (
<OptionsDialogPopup
{options && (
<OptionsDialogPopup
options={options}
data={options_data}
options_class={model.options_class}
@ -699,11 +703,9 @@ class ProductCartItem extends React.PureComponent {
onCardUpdate();
})
}}
/>
))
}
</div>
</OverlayTrigger>
/>
)}
</div>
<h6>{model.name_number}</h6>
@ -1423,30 +1425,35 @@ class OrderSumary extends React.PureComponent {
</td>
<td className="price">
<div>
<div className="d-inline-flex align-content-center">
{`${currency} ${formatMoney(item.price)}`}
<button onClick={this.handleOnDeleteItem.bind(this, index)}>
<img src="/images/shop/icon-remove.svg" />
</button>
<div style={{'width': '45px', 'height': '20px'}} className="d-inline-flex align-content-center align-self-center justify-content-evenly">
{(warning ? (
<img
className="alert-warning align-self-start"
src={`/images/${warning.icon}`}
/>
) : (
<span style={{
'display': 'inline-block',
'width': '20px',
}}>&nbsp;</span>
))}
{((options && options_data) ? (
<OptionsSummaryPopup id={item.id + "options"} options={options} data={options_data} />
) : (
<span style={{
'display': 'inline-block',
'width': '20px',
}}>&nbsp;</span>
))}
</div>
</div>
{warning ? (
<img
style={{'marginLeft': '10px'}}
className="alert-warning"
src={`/images/${warning.icon}`}
/>
) : ( (options && options_data) ?
( <OptionsSummaryPopup id={item.id + "options"} options={options} data={options_data} /> ) : null
)}
{(!warning && !options) && (
<span style={{
'display': 'inline-block',
'width': '30px',
}}>&nbsp;</span>
)}
</td>
</tr>
);

1
static/js/shop_components.jsx
View File

@ -423,7 +423,6 @@ export function OptionsSummaryPopup({id, options, data}) {
return (
<div ref={ref}>
<img className="alert-info" src={show ? "/images/shop/icon-close.svg" : "/images/shop/icon-customize.svg"}
style={{'marginLeft': '10px'}}
id={id + "img"}
onClick={handleClick}/>
<div style={{'display': show ? 'flex' : 'none', 'top': position.y, 'left': position.x}}