@configuratorware/configurator-admingui 1.41.1 → 1.42.1

package/src/Screens/Item/Components/Variants/VariantsEditorDialog.js

@@ -1,143 +0,0 @@
-import React from 'react';
-import { withStyles } from '@material-ui/core/styles';
-import { T } from '../../../../App/i18n';
-import Dialog from '../../../../UIComponents/Dialog';
-import { ITEM_REDUCER_NAME } from '../../Reducers/Actions';
-import RaisedButton from '../../../../UIComponents/RaisedButton';
-import attributesDataStructure from '../../DataStructures/Attributes/Editor';
-import generateConnectedEdit from '../../../../Components/DefaultConnectedForm';
-import VariantActions, { REDUCER_NAME } from '../../Reducers/Variant/Actions';
-import {LocalizedPriceTextField} from "../../../../Components/LocalizedPriceTextField";
-import LocalizedPriceValue from "../../../../Components/LocalizedPriceValue";
-
-const styles = () => ({
-    cancelButton: {
-        position: 'absolute',
-        right: '315px',
-        bottom: '32px',
-    },
-});
-
-const formFields = [
-    {
-        name: 'identifier',
-        label: 'Identifier',
-        type: 'text',
-    },
-    {
-        name: 'texts',
-        label: 'Title',
-        type: 'intl',
-        intl: {
-            name: 'title',
-            type: 'text',
-        },
-    },
-    {
-        name: 'texts',
-        label: 'Abstract',
-        type: 'intl',
-        intl: {
-            name: 'abstract',
-            type: 'text',
-        },
-        multiLine: true,
-        rows: 3,
-    },
-    {
-        name: 'texts',
-        label: 'Description',
-        type: 'intl',
-        intl: {
-            name: 'description',
-            type: 'text',
-        },
-        multiLine: true,
-        rows: 6,
-    },
-    {
-        name: 'minimumOrderAmount',
-        label: 'MinimumOrderAmount',
-        type: 'text',
-    },
-    {
-        name: 'prices',
-        label: 'Prices',
-        type: 'dynSource',
-        sourceConfig: {
-            text: ({ identifier, currency }) => `${identifier} / ${currency.symbol} (${currency.iso})`,
-        },
-        dynSource: {
-            type: 'tabs',
-            reducerName: ITEM_REDUCER_NAME,
-            dataSource: 'channels',
-        },
-        tabs: {
-            filterValues: (channel, value) => +channel.id === +value.channel,
-            assignTabValue: (tabValue, data) => (data.channel = tabValue),
-            name: 'prices',
-            type: 'array',
-            layout: 'groups',
-            className: 'table',
-            array: {
-                columns: null,
-                fields: [
-                    {
-                        name: 'price',
-                        label: 'Price',
-                        type: LocalizedPriceTextField,
-                        renderValue: value => <LocalizedPriceValue data={value}/>,
-                    },
-                    {
-                        name: 'priceNet',
-                        label: 'price Net',
-                        type: LocalizedPriceTextField,
-                        renderValue: value => <LocalizedPriceValue data={value}/>,
-                    },
-                    {
-                        name: 'amountfrom',
-                        label: 'Amount from',
-                        type: 'text',
-                    },
-                ],
-            },
-        },
-    },
-    ...attributesDataStructure,
-];
-
-const BaseDataForm = generateConnectedEdit(
-    formFields,
-    REDUCER_NAME,
-    VariantActions.setFieldData,
-    VariantActions.postData,
-    false,
-    VariantActions.customAction
-);
-
-class VariantsEditorDialog extends React.Component {
-    render() {
-        const { classes } = this.props;
-        return (
-            <Dialog
-                title={T('item.editorPopup.coreData.dialogTitle')}
-                modal={'true'}
-                open={this.props.showBaseDataDialog}
-                scroll={'body'}
-                onClose={this.props.closeEditBaseDataDialog}
-            >
-                <div className={classes.baseDataFormWrapper}>
-                    <BaseDataForm />
-                    <RaisedButton
-                        label={T('Cancel')}
-                        onClick={this.props.closeEditBaseDataDialog}
-                        id="cancel"
-                        className={classes.cancelButton}
-                    />
-                </div>
-            </Dialog>
-        );
-    }
-}
-
-export default withStyles(styles)(VariantsEditorDialog);

package/src/Screens/Item/Components/Variants/VariantsEditorPopup.js

@@ -1,69 +0,0 @@
-import React from 'react';
-import { connect } from 'react-redux';
-import Dialog from '../../../../UIComponents/Dialog';
-
-import GroupEdit from '../../../Group/Containers/Edit';
-import GroupEntryEdit from '../../../GroupEntry/Containers/Edit';
-import * as GroupActions from '../../../Group/Reducers/Actions';
-import * as GroupEntryActions from '../../../GroupEntry/Reducers/Actions';
-
-import { T } from '../../../../App/i18n';
-import { resetDidInvalidate } from '../../../../App/Reducers/Api/Actions';
-
-export class VariantsEditorPopup extends React.Component {
-    render() {
-        const { showGroupEditor, showGroupValueEditor } = this.props;
-
-        return (
-            <div>
-                <Dialog
-                    title={T('item.editorPopup.group.dialogTitle')}
-                    modal={'true'}
-                    open={showGroupEditor}
-                    scroll={'paper'}
-                >
-                    <GroupEdit
-                        customPostData={this.props.customPostData}
-                        onCancel={this.props.cancelGroup}
-                        closeAfterSave
-                    />
-                </Dialog>
-
-                <Dialog
-                    title={T('item.editorPopup.groupEntry.dialogTitle')}
-                    modal={'true'}
-                    open={showGroupValueEditor}
-                    bodyClassName=""
-                    scroll={'body'}
-                >
-                    <GroupEntryEdit onCancel={this.props.cancelGroupEntry} closeAfterSave />
-                </Dialog>
-            </div>
-        );
-    }
-}
-
-const renderStateToProps = state => {
-    const groupEntity = state[GroupActions.REDUCER_NAME];
-    const groupEntryEntity = state[GroupEntryActions.REDUCER_NAME];
-
-    return {
-        showGroupEditor: groupEntity.showDetails,
-        showGroupValueEditor: groupEntryEntity.showDetails,
-    };
-};
-const renderDispatchToProps = dispatch => ({
-    cancelGroup: () => {
-        dispatch(GroupActions.hideDetails(false));
-    },
-    customPostData: async () => {
-        await dispatch(GroupActions.postData(true));
-        // need to reset didInvalidate flag as it is set on save of group which is blocking to reloadList
-        dispatch(resetDidInvalidate(GroupActions.GROUPS_URL));
-    },
-    cancelGroupEntry: () => {
-        dispatch(GroupEntryActions.hideDetails(false));
-    },
-});
-
-export default connect(renderStateToProps, renderDispatchToProps)(VariantsEditorPopup);

package/src/Screens/Item/Components/Variants/VariantsSelection.js

@@ -1,120 +0,0 @@
-import React, { Component } from 'react';
-import _ from 'lodash';
-import SearchBar from '../../../../Components/SearchBar';
-import FlatButton from '../../../../UIComponents/FlatButton';
-import Dialog from '../../../../UIComponents/Dialog';
-import { T } from '../../../../App/i18n';
-import TwoSideSelect from '../../../../Components/FormFragments/TwoSideSelect';
-import Api from '../../../../App/Api';
-
-const renderItemContent = item => {
-    return (
-        <div className="optionSelection-twoSideSelect-item">
-            <div className="optionTitle">{item.translated_title}</div>
-            <div className="optionIdentifier" title={item.identifier}>
-                {item.identifier}
-            </div>
-        </div>
-    );
-};
-
-class VariantsSelection extends Component {
-    constructor(props) {
-        super(props);
-
-        this.state = {
-            items: [],
-            selectedItems: [],
-        };
-    }
-
-    componentWillReceiveProps(props) {
-        if (!this.props.showSelectionDialog && props.showSelectionDialog) {
-            this.setState({ selectedItems: _.cloneDeep(this.props.selectedItems) });
-
-            this.fetchVariants();
-        }
-    }
-
-    fetchVariants = text => {
-        const requestParams = {
-            url: 'creatoritems',
-            params: {
-                query: text,
-                limit: 50,
-            },
-        };
-
-        Api.request(requestParams).then(response => {
-            this.setState({
-                items: response.data.data,
-            });
-        });
-    };
-
-    closeSelection = () => {
-        this.props.closeSelection();
-    };
-
-    setSelection = () => {
-        this.props.setSelection(this.state.selectedItems);
-    };
-
-    change = (name, value) => {
-        this.setState({ selectedItems: value });
-    };
-
-    searchChange = text => {
-        this.fetchVariants(text);
-    };
-
-    render() {
-        const { showSelectionDialog, selectedParentItem } = this.props;
-        const { selectedItems, items } = this.state;
-
-        const actions = [
-            <FlatButton key={'select-btn'} label={T('Select')} primary={true} onClick={this.setSelection} />,
-            <FlatButton
-                key={'cancel-btn'}
-                label={T('Cancel')}
-                primary={false}
-                onClick={this.closeSelection}
-            />,
-        ];
-
-        return (
-            <Dialog
-                title={T('variants.dialogTitle')}
-                actions={actions}
-                modal={'true'}
-                open={showSelectionDialog}
-                bodyClassName="optionSelection-dialogBody"
-                scroll="paper"
-            >
-                <div className="optionSelection-headline">
-                    <div className="source-text">
-                        {T('variants.sourceHeadline')}
-                        <SearchBar
-                            label={'Search'}
-                            onChange={this.searchChange}
-                            className="optionSelection-searchBar"
-                        />
-                    </div>
-                    <div className="selection-text">{T('variants.selectionHeadline')}</div>
-                </div>
-
-                <TwoSideSelect
-                    className="optionSelection-twoSideSelect"
-                    name="selectedoptions"
-                    source={_.filter(items, item => item.id !== selectedParentItem)} //filter out the parent item
-                    value={selectedItems}
-                    onChange={this.change}
-                    sortable={false}
-                    renderItemContent={renderItemContent}
-                />
-            </Dialog>
-        );
-    }
-}
-
-export default VariantsSelection;

package/src/Screens/Item/Components/Variants/VariantsSortFilter.js

@@ -1,158 +0,0 @@
-import React from 'react';
-import { T } from '../../../../App/i18n';
-import FormControl from '../../../../UIComponents/FormControl';
-import InputLabel from '../../../../UIComponents/InputLabel';
-import Input from '../../../../UIComponents/Input';
-import { delay } from '../../../../Components/InputHelpers';
-import Tooltip from '../../../../UIComponents/Tooltip';
-import TableSortLabel from '../../../../UIComponents/TableSortLabel';
-import SearchIcon from '../../../../UIComponents/icons/SearchIcon';
-import _ from 'lodash';
-import withStyles from '@material-ui/core/styles/withStyles';
-
-const styles = () => ({});
-
-class VariantsSortFilter extends React.Component {
-    constructor(props) {
-        super(props);
-        this.state = {
-            open: true,
-        };
-    }
-
-    inputRef = React.createRef();
-
-    onToggleFilter = () => {
-        this.setState({ open: !this.state.open }, () => {
-            if (this.state.open) {
-                this.inputRef.current.focus();
-            } else {
-                this.onFilteredChange(this.props.listParams.value, this.props.sortKey);
-            }
-        });
-    };
-
-    onFilterChange = delay(value => this.onFilteredChange(value, this.props.sortKey));
-
-    onFilteredChange = (value, filterKey) => {
-        const key = filterKey;
-        if (value && value.length > 0) {
-            this.updateListParams({
-                filters: { [key]: value },
-                offset: 0,
-            });
-        } else {
-            this.removeListParams([`filters["${key}"]`]);
-        }
-    };
-
-    onBlur = () => setTimeout(() => !this.props.listParams.value && this.setState({ open: false }), 500);
-
-    onToggleSort = () => {
-        let sort;
-        if (this.props.listParams.sort === 'desc') {
-            sort = null;
-        } else if (this.props.listParams.sort === 'asc') {
-            sort = 'desc';
-        } else {
-            sort = 'asc';
-        }
-        this.onSortChange(sort, this.props.sortKey);
-    };
-
-    onSortChange = (sort, sortKey) => {
-        if (sort) {
-            this.updateListParams({
-                sortKey,
-                sort,
-            });
-        } else {
-            this.removeListParams(['sortKey', 'sort']);
-        }
-    };
-
-    updateListParams = params => {
-        const listParams = _.merge({}, this.props.listParams, params);
-        this.props.updateList(listParams);
-    };
-
-    removeListParams = params => {
-        const listParams = _.omit({}, this.props.listParams, params);
-        this.props.updateList(listParams);
-    };
-
-    renderFilter = () => {
-        const { classes, label, id } = this.props;
-
-        if (!this.state.open) {
-            return (
-                <span className={classes.columnText} onClick={this.onToggleFilter}>
-                    {T(this.props.label)}
-                </span>
-            );
-        }
-
-        return (
-            <FormControl classes={{ root: classes.formControlRoot }}>
-                <InputLabel
-                    htmlFor={id}
-                    classes={{
-                        root: classes.inputLabelRoot,
-                        shrink: classes.inputLabelShrink,
-                    }}
-                >
-                    {label}
-                </InputLabel>
-                <Input
-                    id={id}
-                    inputRef={this.inputRef}
-                    placeholder={'Filter'}
-                    onChange={evt => this.onFilterChange(evt.target.value)}
-                    onBlur={this.onBlur}
-                    disableUnderline={true}
-                />
-            </FormControl>
-        );
-    };
-
-    renderSort = () => {
-        const { classes, sort } = this.props;
-        return (
-            <Tooltip title="Sort" enterDelay={300}>
-                <TableSortLabel
-                    active={sort !== null}
-                    direction={sort || 'asc'}
-                    onClick={this.onToggleSort}
-                    classes={{
-                        icon: classes.sortLabelIcon,
-                    }}
-                />
-            </Tooltip>
-        );
-    };
-
-    render() {
-        const { classes } = this.props;
-        const { open } = this.state;
-        return (
-            <React.Fragment>
-                <Tooltip title="Filter" enterDelay={300}>
-                    <TableSortLabel
-                        active={open || true}
-                        onClick={this.onToggleFilter}
-                        classes={{
-                            icon: classes.sortLabelIcon,
-                        }}
-                        IconComponent={SearchIcon}
-                    />
-                </Tooltip>
-
-                {this.renderFilter()}
-
-                {this.renderSort()}
-            </React.Fragment>
-        );
-    }
-}
-
-export default withStyles(styles)(VariantsSortFilter);