fixed some dialogs

This commit is contained in:
muerwre 2019-02-06 18:36:44 +07:00
parent 39d950d5c5
commit 8c3ce1d1a5
4 changed files with 74 additions and 38 deletions

View file

@ -12,9 +12,6 @@ type Props = {
export class CancelDialog extends React.Component<Props, void> {
cancel = () => {
this.props.stopEditing();
// editor.cancelEditing();
// this.props.setEditing(false);
// this.props.setMode(MODES.NONE);
};
proceed = () => {
@ -31,6 +28,9 @@ export class CancelDialog extends React.Component<Props, void> {
<Icon icon="icon-cancel-1" />
<div className="big upper">Закрыть редактор?</div>
</div>
</div>
<div className="helper cancel-helper">
<div className="helper__text" />
<div className="helper__buttons">
<div className="button router-helper__button" onClick={this.cancel}>
Удалить измения

View file

@ -9,54 +9,71 @@ type Props = {
}
const noPoints = ({ routerCancel }: Props) => (
<div className="helper router-helper">
<div className="helper__text">
<Icon icon="icon-pin-1" />
<div className="big white upper">
Укажите первую точку на карте
<React.Fragment>
<div className="helper router-helper">
<div className="helper__text">
<Icon icon="icon-pin-1" />
<div className="big white upper">
Укажите первую точку на карте
</div>
</div>
</div>
<div className="helper__buttons">
<div className="button router-helper__button" onClick={routerCancel}>
Отмена
<div className="helper router-helper">
<div className="helper__buttons flex_1">
<div className="flex_1" />
<div className="button router-helper__button" onClick={routerCancel}>
Отмена
</div>
</div>
</div>
</div>
</React.Fragment>
);
const firstPoint = ({ routerCancel }: Props) => (
<div className="helper router-helper">
<div className="helper__text">
<Icon icon="icon-pin-1" />
<div className="big white upper">УКАЖИТЕ СЛЕДУЮЩУЮ ТОЧКУ</div>
</div>
<div className="helper__buttons">
<div className="button router-helper__button" onClick={routerCancel}>
Отмена
<React.Fragment>
<div className="helper router-helper">
<div className="helper__text">
<Icon icon="icon-pin-1" />
<div className="big white upper">УКАЖИТЕ СЛЕДУЮЩУЮ ТОЧКУ</div>
</div>
</div>
</div>
<div className="helper router-helper">
<div className="helper__buttons flex_1">
<div className="flex_1" />
<div className="button router-helper__button" onClick={routerCancel}>
Отмена
</div>
</div>
</div>
</React.Fragment>
);
const draggablePoints = ({ routerCancel, routerSubmit }: Props) => (
<div className="helper router-helper">
<div className="helper__text success">
<Icon icon="icon-check-1" />
<div className="big upper">Продолжайте маршрут</div>
</div>
<div className="helper__buttons button-group">
<div className="button button_red router-helper__button" onClick={routerCancel}>
Отмена
</div>
<div className="button primary router-helper__button" onClick={routerSubmit}>
Применить
<React.Fragment>
<div className="helper">
<div className="helper__text success">
<Icon icon="icon-check-1" />
<div className="big upper">Продолжайте маршрут</div>
</div>
</div>
</div>
<div className="helper router-helper">
<div className="helper__buttons button-group flex_1">
<div className="flex_1" />
<div className="button button_red router-helper__button" onClick={routerCancel}>
Отмена
</div>
<div className="button primary router-helper__button" onClick={routerSubmit}>
Применить
</div>
</div>
</div>
</React.Fragment>
);
export const RouterDialog = ({ routerPoints, routerCancel, routerSubmit, width }: Props) => (
<div className="control-dialog control-dialog-big" style={{ width }}>
export const RouterDialog = ({
routerPoints, routerCancel, routerSubmit, width
}: Props) => (
<div className="control-dialog" style={{ width }}>
{!routerPoints && noPoints({ routerCancel })}
{routerPoints === 1 && firstPoint({ routerCancel })}
{routerPoints >= 2 && draggablePoints({ routerCancel, routerSubmit })}

View file

@ -13,13 +13,15 @@ type Props = {
export const TrashDialog = ({
clearPoly, clearStickers, clearAll, clearCancel, width,
}: Props) => (
<div className="control-dialog control-dialog-big" style={{ width }}>
<div className="control-dialog" style={{ width }}>
<div className="helper trash-helper">
<div className="helper__text danger">
<Icon icon="icon-trash-4" />
<div className="big upper desktop-only">Удалить:</div>
</div>
<div className="helper__buttons">
</div>
<div className="helper trash-helper">
<div className="helper__buttons flex_1">
<div className="button-group">
<div className="button router-helper__button" onClick={clearPoly}>
Маршрут
@ -31,6 +33,7 @@ export const TrashDialog = ({
ВСЕ
</div>
</div>
<div className="flex_1" />
<div className="button primary router-helper__button" onClick={clearCancel}>
Отмена
</div>

View file

@ -235,6 +235,18 @@
}
}
.helper:first-child {
border-radius: @panel_radius @panel_radius 0 0;
}
.helper:last-child {
border-radius: 0 0 @panel_radius @panel_radius;
}
.helper:only-child {
border-radius: @panel_radius;
}
}
.control-dialog-provider {
@ -255,7 +267,7 @@
display: flex;
background: #222222;
border-radius: @panel_radius;
//border-radius: @panel_radius;
box-shadow: @bar_shadow;
@media (max-width: @mobile_breakpoint) {
@ -304,6 +316,10 @@
}
}
.flex_1 {
flex: 1;
}
.helper__buttons {
display: flex;
align-items: center;