diff --git a/src/groups/newGroup.js b/src/groups/newGroup.js new file mode 100644 index 0000000000000000000000000000000000000000..2b88252c498e8175ed4c8970c789d0aaf609ddf3 --- /dev/null +++ b/src/groups/newGroup.js @@ -0,0 +1,27 @@ +import m from 'mithril'; +import EditView from '../views/editView'; +import { RaisedButton } from 'polythene-mithril'; + + +export default class NewGroup extends EditView { + constructor(vnode) { + super(vnode, 'groups', {}); + this.callback = () => { m.route.set('/groups'); }; + } + + view() { + const submitButton = m(RaisedButton, { + disabled: !this.valid, + label: 'Submit', + events: { onclick: () => { this.submit(); } }, + }); + + return m('div.mywrapper', [ + m('h3', 'Add a New Group'), + ...this.renderPage({ + name: { type: 'text', label: 'Group Name'}, + }), + submitButton, + ]); + } +} diff --git a/src/groups/overview.js b/src/groups/overview.js index be8acda3b03204fe00cd5340044a17eea4ebc368..e1f051b61b9ab8b38672d8910b9677ba68542575 100644 --- a/src/groups/overview.js +++ b/src/groups/overview.js @@ -33,8 +33,15 @@ export default class GroupList { if (!this.data) return ''; return m( - 'div', { style: { display: 'flex' } }, + 'div', { style: { display: 'flex', 'flex-wrap': 'wrap' } }, this.data.map(item => m(GroupItem, item)), + m('div', { + style: { + padding: '20px', + 'max-width': '500px', + }, + onclick: () => { m.route.set('/newgroup'); }, + }, m(Card, { content: [{ primary: { title: '+ add' } }] })), ); } } diff --git a/src/index.js b/src/index.js index a21e8232dae0548f2da456fe04648cb8cceb3ac9..7ff710ab076c7fc322422d5360f3346b712bba1f 100644 --- a/src/index.js +++ b/src/index.js @@ -4,6 +4,7 @@ import GroupList from './groups/overview'; import viewGroup from './groups/viewGroup'; import { UserModal, UserTable, NewUser } from './users/userTool'; import { MembershipView } from './membershipTool'; +import NewGroup from './groups/newGroup'; import EventTable from './events/table'; import newEvent from './events/newEvent'; import EventModal from './events/eventModal'; @@ -35,6 +36,7 @@ m.route(root, '/users', { '/eventwithexport': layoutWith(eventWithExport), '/groups': layoutWith(GroupList), '/groups/:id': layoutWith(viewGroup), + '/newgroup': layoutWith(NewGroup), '/oauthcallback': OauthRedirect, // '/announce': layoutWith(AnnounceTool), });