Election Table component
ddfridley opened this issue · 1 comments
ddfridley commented
<ElectionTable
className={}
style={}
electionOM={[electionObj, electionMethods]}
}
See #46 for electionOM details
Requires
- #88 for a component to display the table and edit its data
- Renders the table of candidates, offices, etc
- edit manually button allows user to edit the entries.
- For the Upload CSV file button create a separate component for each button that returns the icon. We will add functionality to this later. Pass electionOM into the component
<UploadCSV className={} style={} electionOM={electionOM}>This way the component can update the table when implemented. - For the Paste Google sheets button create a separate component for each button that returns the icon. We will add functionality to this later. Pass in electionOM as above.
- Use react-perfect-scrollbar to implement the scrolling of the table.
- What columns are in the table should be defined in the table, not in this component.
- react-table might be a useful tool for rendering the table, but their might be better packages - the implementer can investigate.
- Editing the table should be like editing a spreadsheet - you just type in the new data. This might effect the selection of the package above.
- UI needs to include ability to add lines to the table when edition.
- When a line is added or updated, electionMethods.updateElectionTable(row, obj) will be called (this may be revised)
- Not shown in the design, there should be a column called Unique Id. Whenever a new line is created, give it a uniqueId using:
import objectid from 'isomorphic-mongo-objectid'
const uniqueId=objectid().toString()
- Not in the UI but desirable - the user should be able to sort the table by a column. react-table has this feature.
figma: https://www.figma.com/file/yXrcMvg5EIwdLkHHxIdILh/Undebate-Self-Service-Portal?node-id=362%3A5313
- See additional frames in the figma design below the initial one
