diff --git a/src/api/treeTrackerApi.js b/src/api/treeTrackerApi.js index daaaad4d5..3f71de938 100644 --- a/src/api/treeTrackerApi.js +++ b/src/api/treeTrackerApi.js @@ -197,7 +197,7 @@ export default { body: JSON.stringify({ name: payload.name, desc: payload.desc, - active: 0, + active: true, valueFactor: 0, }), }) @@ -217,7 +217,7 @@ export default { id: id, name: name, desc: desc, - active: 0, + active: true, valueFactor: 0, }), }) @@ -239,6 +239,27 @@ export default { .then(handleResponse) .catch(handleError); }, + combineSpecies(combine, name, desc) { + const query = `${process.env.REACT_APP_API_ROOT}/api/species/combine`; + return fetch(query, { + method: 'POST', + headers: { + 'content-type': 'application/json', + Authorization: session.token, + }, + body: JSON.stringify({ + combine, + species: { + name, + desc, + active: true, + valueFactor: 0, + }, + }), + }) + .then(handleResponse) + .catch(handleError); + }, /* * get tree count by species */ diff --git a/src/components/SpeciesTable.js b/src/components/SpeciesTable.js index a67dbad1a..fa17b3ab9 100644 --- a/src/components/SpeciesTable.js +++ b/src/components/SpeciesTable.js @@ -1,7 +1,11 @@ import React from 'react'; import { connect } from 'react-redux'; import { + Checkbox, Grid, + List, + ListItem, + ListItemText, TableContainer, Table, TableHead, @@ -52,6 +56,7 @@ const styles = (theme) => ({ }, addUser: { color: 'white', + marginLeft: '20px', }, input: { margin: theme.spacing(0, 1, 4, 1), @@ -93,6 +98,15 @@ const styles = (theme) => ({ bottom: 12, left: 10, }, + listItem: { + padding: '0 16px', + }, + paddingBottom: { + paddingBottom: '24px', + }, + minWidth: { + minWidth: '320px', + }, }); const SpeciesTable = (props) => { @@ -107,6 +121,8 @@ const SpeciesTable = (props) => { const [openDelete, setOpenDelete] = React.useState(false); const [sortedSpeciesList, setSortedSpeciesList] = React.useState([]); const [option, setOption] = React.useState(sortOptions.byName); + const [selected, setSelected] = React.useState([]); + const [showCombine, setShowCombine] = React.useState(false); const tableRef = React.useRef(null); @@ -165,6 +181,16 @@ const SpeciesTable = (props) => { setOpenDelete(true); }; + const openCombineModal = () => { + if (selected.length > 1) setShowCombine(true); + else alert('Please select two or more species to be combined!'); + }; + + const handleSelect = (checked, id) => { + if (checked) setSelected([...selected, id]); + else setSelected(selected.filter((item) => item !== id)); + }; + const renderSpecies = () => { return (rowsPerPage > 0 ? sortedSpeciesList.slice( @@ -174,6 +200,11 @@ const SpeciesTable = (props) => { : sortedSpeciesList ).map((species) => ( + + handleSelect(e.target.checked, species.id)} + /> + {species.id} @@ -233,6 +264,13 @@ const SpeciesTable = (props) => { +