diff options
| author | gabrhr <[email protected]> | 2022-06-01 13:08:52 -0500 |
|---|---|---|
| committer | gabrhr <[email protected]> | 2022-06-01 13:08:52 -0500 |
| commit | 77fb39778fc4ebb3eea9e9801320efe1a4878c9a (patch) | |
| tree | c76bd4219582e5acf6b6680981cacbbe4bb055ed /front/odiparpack/app/containers/Odipar/RedTramos | |
| parent | cbc7d7f7494508fda69e88c76702a878bebca0e2 (diff) | |
| download | DP1_project-77fb39778fc4ebb3eea9e9801320efe1a4878c9a.tar.gz DP1_project-77fb39778fc4ebb3eea9e9801320efe1a4878c9a.tar.bz2 DP1_project-77fb39778fc4ebb3eea9e9801320efe1a4878c9a.zip | |
Add Almacen, Ruta, Camiones (Flota, Camiones, Averías)
#TODO
- Arreglar combos
- Añadir los reducer de camiones, rutas, almacen
Diffstat (limited to 'front/odiparpack/app/containers/Odipar/RedTramos')
6 files changed, 478 insertions, 0 deletions
diff --git a/front/odiparpack/app/containers/Odipar/RedTramos/RutaTab/RutaTab.js b/front/odiparpack/app/containers/Odipar/RedTramos/RutaTab/RutaTab.js new file mode 100644 index 0000000..b35259a --- /dev/null +++ b/front/odiparpack/app/containers/Odipar/RedTramos/RutaTab/RutaTab.js @@ -0,0 +1,72 @@ +import React, { Component } from 'react'; +import { withStyles } from '@material-ui/core/styles'; +import PropTypes from 'prop-types'; +import { CrudRutaTab } from './table' +import { Grid, Paper, Typography } from '@material-ui/core'; +import { connect } from 'react-redux'; +import { Direction } from 'ba-containers/Maps/demos' + +//actions +import { getPedidos } from 'ba-actions/pedido'; + +const styles = ({ + root: { + flexGrow: 1, + marginTop: 30, + } + }); + +class RutaTab extends Component { + constructor (props) { + super(props) + this.state = { + dataRealF: [] + }; + this.props.dispatch(getPedidos()).then((res) => { + if (res) { + this.setState({ + dataRealF: res.data, + }); + } + }) + } + + + render() { + const {dataRealF} = this.state; + const { classes } = this.props; + return ( + <Grid container> + <Grid item xs={12} sm={6}> + <CrudRutaTab title = "" dataReal={dataRealF}/> + </Grid> + <Grid item xs={12} sm={6}> + <Paper className={classes.paper} style={{marginLeft: "10px"}}> + <Direction/> + </Paper> + </Grid> + </Grid> + ); + } +} + +RutaTab.propTypes = { + classes: PropTypes.object.isRequired, +}; + +const reducer = 'pedido' +const mapStateToProps = state => ({ + force: state, // force state from reducer + pedidosLista : state.getIn([reducer]), +}); + +const mapDispatchToProps = dispatch => ({ + dispatch +}); + +const RutaTabMapped = connect( + mapStateToProps, + mapDispatchToProps +)(RutaTab); + +export default withStyles(styles)(RutaTabMapped);
\ No newline at end of file diff --git a/front/odiparpack/app/containers/Odipar/RedTramos/RutaTab/table/CrudRutaTab.js b/front/odiparpack/app/containers/Odipar/RedTramos/RutaTab/table/CrudRutaTab.js new file mode 100644 index 0000000..b3cea2a --- /dev/null +++ b/front/odiparpack/app/containers/Odipar/RedTramos/RutaTab/table/CrudRutaTab.js @@ -0,0 +1,149 @@ +import React, { Component } from 'react'; +import PropTypes from 'prop-types'; +import { withStyles } from '@material-ui/core/styles'; +import { connect } from 'react-redux'; +import { bindActionCreators } from 'redux'; +import { + fetchAction, + addAction, + closeAction, + submitAction, + removeAction, + editAction, + closeNotifAction +} from 'ba-actions/CrudTbFrmActions'; +import { CrudTableForm, Notification } from 'ba-components'; +import { + Paper, + RadioGroup, +} from '@material-ui/core'; +import { anchorTable, dataApi } from './dataRuta'; +import FormRutaTab from './FormRutaTab'; +//actions +import { getPedidos } from 'ba-actions/pedido'; +const branch = 'crudRuta'; + +const renderRadioGroup = ({ input, ...rest }) => ( + <RadioGroup + {...input} + {...rest} + valueselected={input.value} + onChange={(event, value) => input.onChange(value)} + /> +); + + +const styles = ({ + root: { + flexGrow: 1, + } +}); + +class CrudRutaTab extends Component { + + render() { + //console.log("render ps") + const { + classes, + fetchData, + addNew, + closeForm, + submit, + removeRow, + editRow, + dataTable, + openForm, + initValues, + closeNotif, + messageNotif, + title, + dataReal, + dispatch, + editingId + } = this.props; + + //console.log("render ps DATA", dataReal) + //console.log("original", dataApi) + + return ( + <div> + <Notification close={() => closeNotif(branch)} variant = "success" message={messageNotif} /> + <Paper className={classes.root}> + <CrudTableForm + dataTable={dataTable} + openForm={openForm} + dataInit={dataApi} + anchor={anchorTable} + title={title} + fetchData={fetchData} + addNew={addNew} + closeForm={closeForm} + submit={submit} + removeRow={removeRow} + editRow={editRow} + branch={branch} + initValues={initValues} + addNewAPI={getPedidos} + removeRowAPI={getPedidos} + editRowAPI={getPedidos} + dispatch = {dispatch} + editingId = {editingId} + > + {/* Create Your own form, then arrange or custom it as You like */} + <FormRutaTab/> + {/* No need create button or submit, because that already made in this component */} + </CrudTableForm> + </Paper> + </div> + ); + } +} + +renderRadioGroup.propTypes = { + input: PropTypes.object.isRequired, +}; + +CrudRutaTab.propTypes = { + dataTable: PropTypes.object.isRequired, + openForm: PropTypes.bool.isRequired, + classes: PropTypes.object.isRequired, + fetchData: PropTypes.func.isRequired, + addNew: PropTypes.func.isRequired, + closeForm: PropTypes.func.isRequired, + submit: PropTypes.func.isRequired, + removeRow: PropTypes.func.isRequired, + editRow: PropTypes.func.isRequired, + initValues: PropTypes.object.isRequired, + closeNotif: PropTypes.func.isRequired, + messageNotif: PropTypes.string.isRequired, + title: PropTypes.string.isRequired, +}; + + +const mapStateToProps = state => ({ + force: state, // force state from reducer + initValues: state.getIn([branch, 'formValues']), + dataTable: state.getIn([branch, 'dataTable']), + openForm: state.getIn([branch, 'showFrm']), + messageNotif: state.getIn([branch, 'notifMsg']), + editingId: state.getIn([branch, 'editingId']), + pedidosLista : state.getIn(['pedido','pedidos']), +}); + +const mapDispatchToProps = dispatch => ({ + fetchData: bindActionCreators(fetchAction, dispatch), + addNew: bindActionCreators(addAction, dispatch), + closeForm: bindActionCreators(closeAction, dispatch), + submit: bindActionCreators(submitAction, dispatch), + removeRow: bindActionCreators(removeAction, dispatch), + editRow: bindActionCreators(editAction, dispatch), + closeNotif: bindActionCreators(closeNotifAction, dispatch), + dispatch +}); + +const CrudRutaTabMapped = connect( + mapStateToProps, + mapDispatchToProps +)(CrudRutaTab); + +export default withStyles(styles)(CrudRutaTabMapped); diff --git a/front/odiparpack/app/containers/Odipar/RedTramos/RutaTab/table/FormRutaTab.js b/front/odiparpack/app/containers/Odipar/RedTramos/RutaTab/table/FormRutaTab.js new file mode 100644 index 0000000..60ba534 --- /dev/null +++ b/front/odiparpack/app/containers/Odipar/RedTramos/RutaTab/table/FormRutaTab.js @@ -0,0 +1,108 @@ +import React, { Component } from 'react'; +import { withStyles } from '@material-ui/core/styles'; +import PropTypes from 'prop-types'; +import { Field } from 'redux-form/immutable'; +import {required, integer} from 'ba-api/validation' +import { + SelectRedux, + TextFieldRedux, + DatePickerRedux, + EstadoRedux +} from 'ba-components/Forms/ReduxFormMUI'; +import { + MenuItem, + InputLabel, + FormControl, + Typography, + } from '@material-ui/core'; + +const styles = ({ + root: { + flexGrow: 1, + }, + field: { + width: '100%', + marginBottom: 20 + }, + fieldBasic: { + width: '100%', + marginBottom: 20, + marginTop: 10 + }, + inlineWrap: { + display: 'flex', + flexDirection: 'row' + } + }); + + +class FormAveriaTab extends Component { + saveRef = ref => { + this.ref = ref; + return this.ref; + }; + + state = { + selectedDate: new Date(), + } + + handleDateChange = (date) => { + this.setState({ selectedDate: date }); + } + render() { + const { classes } = this.props; + const trueBool = true; + return ( + <> + <div> + <FormControl className={classes.field}> + <InputLabel htmlFor="selection">Origen</InputLabel> + <Field + name="origen" + component={SelectRedux} + placeholder="Seleccionar" + autoWidth={trueBool} + > + <MenuItem value="Lima">Lima</MenuItem> + <MenuItem value="Arequipa">Arequipa</MenuItem> + <MenuItem value="Cuzco">Cuzco</MenuItem> + </Field> + </FormControl> + </div> + <div> + <FormControl className={classes.field}> + <InputLabel htmlFor="selection">Destino</InputLabel> + <Field + name="destino" + component={SelectRedux} + placeholder="Seleccionar" + autoWidth={trueBool} + > + <MenuItem value="Lima">Lima</MenuItem> + <MenuItem value="Arequipa">Arequipa</MenuItem> + <MenuItem value="Cuzco">Cuzco</MenuItem> + </Field> + </FormControl> + </div> + <div> + <Field + name="distancia" + component={TextFieldRedux} + placeholder="Distancia" + label="Distancia (km)" + validate={[required]} + required + ref={this.saveRef} + className={classes.field} + /> + </div> + </> + ); + } +} + +FormAveriaTab.propTypes = { + classes: PropTypes.object.isRequired, + }; + +export default withStyles(styles)(FormAveriaTab);
\ No newline at end of file diff --git a/front/odiparpack/app/containers/Odipar/RedTramos/RutaTab/table/dataRuta.js b/front/odiparpack/app/containers/Odipar/RedTramos/RutaTab/table/dataRuta.js new file mode 100644 index 0000000..762fb8f --- /dev/null +++ b/front/odiparpack/app/containers/Odipar/RedTramos/RutaTab/table/dataRuta.js @@ -0,0 +1,59 @@ +export const anchorTable = [ + { + name: 'id', + label: 'Número Avería', + initialValue: '', + hidden: true, + type: 'texto' + }, { + name: 'origen', + label: 'Provincia origen', + initialValue: 'Lima', + width: '13%', + hidden: false, + type: 'texto' + }, { + name: 'destino', + label: 'Provincia destino', + initialValue: 'Arequipa', + width: '13%', + hidden: false, + type: 'texto' + }, { + name: 'distancia', + label: 'Distancia (km)', + initialValue: 0, + width: '10%', + hidden: false, + type: 'texto' + }, { + name: 'estado', + label: 'Estado', + initialValue: 0, + width: '10%', + hidden: false, + type: 'etiq_ruta' + }, + { + name: 'action', + label: 'Action', + initialValue: '', + hidden: false + }, +]; + +export const dataApi = [ + { + id: '1', + origen: 'Lima', + destino: 'Arequipa', + distancia: 234, + estado: 0, + }, { + id: '2', + origen: 'Lima', + destino: 'Cuzco', + distancia: 234, + estado: 1, + } +]; diff --git a/front/odiparpack/app/containers/Odipar/RedTramos/RutaTab/table/index.js b/front/odiparpack/app/containers/Odipar/RedTramos/RutaTab/table/index.js new file mode 100644 index 0000000..31656fe --- /dev/null +++ b/front/odiparpack/app/containers/Odipar/RedTramos/RutaTab/table/index.js @@ -0,0 +1 @@ +export CrudRutaTab from "./CrudRutaTab"; diff --git a/front/odiparpack/app/containers/Odipar/RedTramos/TramosMain.js b/front/odiparpack/app/containers/Odipar/RedTramos/TramosMain.js new file mode 100644 index 0000000..4d0ecea --- /dev/null +++ b/front/odiparpack/app/containers/Odipar/RedTramos/TramosMain.js @@ -0,0 +1,89 @@ +import React, { Component } from 'react'; +import { withStyles } from '@material-ui/core/styles'; +import PropTypes from 'prop-types'; +import { AppBar, Tabs, Tab, Paper, Typography } from '@material-ui/core'; +import { connect } from 'react-redux'; +import RutaTab from './RutaTab/RutaTab'; +//actions + + +function TabContainer(props) { + return ( + <Typography component="div" style={{ padding: 8 * 3 }}> + {props.children} + </Typography> + ); + } + + TabContainer.propTypes = { + children: PropTypes.node.isRequired, + }; + +const styles = ({ + root: { + flexGrow: 1, + marginTop: 30, + } + }); + +class CamionesMain extends Component { + constructor (props) { + + super(props) + this.state = { + value: 0 + }; + + } + + handleChange = (event, value) => { + this.setState({ value }); + }; + + render() { + const {value} = this.state; + const { classes } = this.props; + return ( + <div> + <div> + <Paper className={classes.root}> + <AppBar position="static"> + <Tabs value={value} onChange={this.handleChange}> + <Tab label="Rutas" /> + <Tab label="Bloqueos" /> + </Tabs> + </AppBar> + {value === 0 && + <TabContainer> + <RutaTab/> + </TabContainer>} + {value === 1 && + <TabContainer> + bbbb + </TabContainer>} + </Paper> + </div> + </div> + ); + } +} + +CamionesMain.propTypes = { + classes: PropTypes.object.isRequired, +}; + +const reducer = 'pedido' +const mapStateToProps = state => ({ + force: state, // force state from reducer +}); + +const mapDispatchToProps = dispatch => ({ + dispatch +}); + +const CamionesMainMapped = connect( + mapStateToProps, + mapDispatchToProps +)(CamionesMain); + +export default withStyles(styles)(CamionesMainMapped);
\ No newline at end of file |
