Editing and Viewing of Joboffers

package.json

@@ -26,7 +26,8 @@
     "polythene-core-css": "^1.2.0",
     "polythene-css": "^1.2.0",
     "polythene-mithril": "^1.2.0",
-    "querystring": "^0.2.0"
+    "querystring": "^0.2.0",
+    "showdown": "^1.9.0"
   },
   "devDependencies": {
     "babel-cli": "^6.26.0",

src/groups/editGroup.js

@@ -84,7 +84,7 @@ export default class NewGroup extends EditView {
   }
 
   beforeSubmit() {
-    const data = this.form.data;
+    const { data } = this.form;
     // exchange moderator object with string of id
     this.submit({ ...data, moderator: data.moderator ? data.moderator._id : undefined });
   }

src/jobs/editJob.js

 import m from 'mithril';
+import { FileInput } from 'amiv-web-ui-components';
 import EditView from '../views/editView';
 
 
 export default class newJob extends EditView {
+  beforeSubmit() {
+    console.log(this.form.data);
+    // remove all unchanged files
+    if (this.form.data.pdf !== undefined &&
+        (this.form.data.pdf === null || 'upload_date' in this.form.data.pdf)) {
+      delete this.form.data.pdf;
+    }
+    if (this.form.data.logo !== undefined &&
+        (this.form.data.logo === null || 'upload_date' in this.form.data.logo)) {
+      delete this.form.data.logo;
+    }
+
+    // post everyhing together as FormData
+    const submitData = new FormData();
+    Object.keys(this.form.data).forEach((key) => {
+      submitData.append(key, this.form.data[key]);
+    });
+    this.submit(submitData);
+  }
+
   view() {
     return this.layout([
       m('h3', 'Add a New Job Offer'),
+      ...this.form.renderPage({ company: { type: 'text', label: 'Company' } }),
+      m(FileInput, this.form.bind({
+        name: 'logo',
+        label: 'Company Logo',
+        accept: 'image/png, image/jpeg',
+      })),
       ...this.form.renderPage({
+        time_end: {
+          type: 'datetime',
+          label: 'End of Advertisement',
+          required: true,
+        },
+        title_en: { type: 'text', label: 'English Title' },
+        description_en: {
+          type: 'text',
+          label: 'English Text',
+          multiLine: true,
+          rows: 5,
+        },
         title_de: { type: 'text', label: 'German Title' },
+        description_de: {
+          type: 'text',
+          label: 'German Text',
+          multiLine: true,
+          rows: 5,
+        },
       }),
+      m(FileInput, this.form.bind({
+        name: 'pdf',
+        label: 'PDF',
+        accept: 'application/pdf',
+      })),
     ]);
   }
 }

src/jobs/viewJob.js

 import m from 'mithril';
+import { Converter } from 'showdown';
+import { Card } from 'polythene-mithril';
 // eslint-disable-next-line import/extensions
 import { apiUrl } from 'networkConfig';
 import ItemView from '../views/itemView';
@@ -6,23 +8,47 @@ import { dateFormatter } from '../utils';
 import { Property } from '../views/elements';
 
 export default class viewJob extends ItemView {
+  constructor(vnode) {
+    super(vnode);
+    this.markdown = new Converter();
+  }
+
   view() {
+    const stdMargin = { margin: '5px' };
+
     return this.layout([
-      m('div', [
+      m('div', { style: { height: '50px' } }, [
         // company logo if existing
-        this.data.img_thumbnail ? m('img', {
+        this.data.logo ? m('img', {
           src: `${apiUrl}/${this.data.logo.file}`,
           height: '50px',
           style: { float: 'left' },
         }) : '',
         m('h3', {
-          style: { 'margin-top': '0px', 'margin-bottom': '0px' },
-        }, [this.data.title_de || this.data.title_en]),
+          style: { 'line-height': '50px', 'margin-top': '0px' },
+        }, this.data.company),
       ]),
       // below the title, most important details are listed
-      this.data.time_end ? m(Property, {
-        title: 'Offer Ends',
-      }, `${dateFormatter(this.data.time_end)}`) : '',
+      m('div', { style: { display: 'flex', margin: '5px 0px 0px 5px' } }, [
+        this.data.time_end ? m(Property, {
+          title: 'Offer Ends',
+          style: stdMargin,
+        }, `${dateFormatter(this.data.time_end)}`) : '',
+      ]),
+      m('div.viewcontainer', [
+        m('div.viewcontainercolumn', m(Card, {
+          content: m('div.maincontainer', [
+            m('div.pe-card__title', this.data.title_de),
+            m('div', m.trust(this.markdown.makeHtml(this.data.description_de))),
+          ]),
+        })),
+        m('div.viewcontainercolumn', m(Card, {
+          content: m('div.maincontainer', [
+            m('div.pe-card__title', this.data.title_en),
+            m('div', m.trust(this.markdown.makeHtml(this.data.description_en))),
+          ]),
+        })),
+      ]),
     ]);
   }
 }

src/layout.js

@@ -4,7 +4,6 @@ import {
   ListTile,
   Icon,
   Toolbar,
-  ToolbarTitle,
   Dialog,
   SVG,
   Button,
@@ -110,7 +109,7 @@ export class Layout {
             events: { onclick: () => { toggleDrawer(); } },
             style: { color: '#ffffff' },
           })),
-          m(ToolbarTitle, { text: 'AMIV Admintools' }),
+          m('div', { style: { 'font-size': '18px', 'margin-left': '20px' } }, 'AMIV Admintools'),
           m('a', {
             href: 'https://gitlab.ethz.ch/amiv/amiv-admintool/issues/new?issuable_template=Bug',
             target: '_blank',
@@ -118,8 +117,8 @@ export class Layout {
               color: '#888888',
               'text-decoration': 'none',
               'text-align': 'right',
-              width: '50em',
-              'margin-right': '100px',
+              'margin-right': '20px',
+              'margin-left': 'auto',
             },
           }, 'Is something not working? Report a bug!'),
           m(Button, {

src/studydocs/editDoc.js

@@ -19,7 +19,7 @@ export default class editDoc extends EditView {
     // load schema
     m.request(`${apiUrl}/docs/api-docs`).then((schema) => {
       // remove the files list as it is impossible to validate
-      const docSchema = schema.definitions.Studydocument;
+      const docSchema = schema.definitions['Study Document'];
       delete docSchema.properties.files;
       this.form.setSchema(docSchema);
     }).catch((error) => { console.log(error); });

src/views/editView.js

@@ -10,11 +10,12 @@ import { colors } from '../style';
 // Mapper for resource vs schema-object names
 const objectNameForResource = {
   users: 'User',
-  groupmembershipds: 'Groupmembership',
+  groupmemberships: 'Group Membership',
   groups: 'Group',
-  eventsignups: 'Eventsignup',
+  eventsignups: 'Event Signup',
   events: 'Event',
-  studydocuments: 'Studydocument',
+  studydocuments: 'Study Document',
+  joboffers: 'Job Offer',
 };
 
 export default class EditView extends ItemView {