RESCOI-453:Admin: Upload attachments to disclosures

kuali · Jan 25, 2016 · 5d96f1d · 5d96f1d
1 parent 449bc55
commit 5d96f1d
Show file tree

Hide file tree

Showing 15 changed files with 444 additions and 23 deletions.
diff --git a/COIConstants.js b/COIConstants.js
@@ -42,7 +42,8 @@ export const COIConstants = {
   FILE_TYPE: {
     FINANCIAL_ENTITY: 'financialEntity',
     DISCLOSURE: 'disclosure',
-    MANAGEMENT_PLAN: 'managementPlan'
+    MANAGEMENT_PLAN: 'managementPlan',
+    ADMIN: 'admin'
   },
   DISCLOSURE_TYPE: {
     MANUAL: '1',

diff --git a/client/scripts/actions/AdminActions.js b/client/scripts/actions/AdminActions.js
@@ -19,6 +19,19 @@
 import alt from '../alt';
 
 class _AdminActions {
+
+  constructor() {
+    this.generateActions(
+      'showUploadAttachmentsPanel',
+      'hideUploadAttachmentsPanel',
+      'addAdminAttachment',
+      'deleteAdminAttachment',
+      'addAdminAttachmentToState',
+      'removeAdminAttachmentFromState',
+      'setApplicationStateForTest'
+    );
+  }
+
   changeSort(newSortField) { this.dispatch(newSortField); }
 
   flipSortDirection() { this.dispatch(); }

diff --git a/client/scripts/components/Admin/DetailView/ActionButtons/index.js b/client/scripts/components/Admin/DetailView/ActionButtons/index.js
@@ -71,6 +71,12 @@ export default function ActionButtons(props) {
           <div>REVIEW COMMENTS</div>
         </span>
       </div>
+      <div className={styles.button} onClick={AdminActions.showUploadAttachmentsPanel}>
+        <i className={`fa fa-download ${styles.icon}`}></i>
+        <span className={styles.label}>
+          <div>UPLOAD ATTACHMENTS</div>
+        </span>
+      </div>
     </div>
   );
 }
diff --git a/client/scripts/components/Admin/DetailView/DetailView/index.js b/client/scripts/components/Admin/DetailView/DetailView/index.js
@@ -27,6 +27,7 @@ import CommentingPanel from '../CommentingPanel';
 import AdditionalReviewPanel from '../AdditionalReviewPanel';
 import CommentSummary from '../CommentSummary';
 import GeneralAttachmentsPanel from '../GeneralAttachmentsPanel';
+import UploadAttachmentsPanel from '../UploadAttachmentsPanel';
 import {COIConstants} from '../../../../../../COIConstants';
 import {AppHeader} from '../../../AppHeader';
 import classNames from 'classnames';
@@ -151,6 +152,16 @@ export class DetailView extends React.Component {
         />
       );
     }
+    else if (this.state.applicationState.uploadAttachmentsShowing) {
+      const adminFiles = this.state.applicationState.selectedDisclosure.files
+        .filter(file => file.file_type === COIConstants.FILE_TYPE.ADMIN );
+      sidePanel = (
+        <UploadAttachmentsPanel
+          files={adminFiles}
+          readonly={this.state.applicationState.selectedDisclosure.statusCd === COIConstants.DISCLOSURE_STATUS.UP_TO_DATE}
+        />
+      );
+    }
 
     let disclosureDetail;
     if (this.state.applicationState.selectedDisclosure && this.state.config) {

diff --git a/client/scripts/components/Admin/DetailView/DisclosureDetail/index.js b/client/scripts/components/Admin/DetailView/DisclosureDetail/index.js
@@ -149,6 +149,10 @@ export class DisclosureDetail extends React.Component {
       {[styles.showRejection]: this.props.showRejection}
     );
 
+    const showAttachments = this.props.disclosure.files
+        .filter(file => file.fileType === COIConstants.FILE_TYPE.DISCLOSURE)
+        .length > 0;
+
     return (
       <div
         className={classes}
@@ -191,7 +195,7 @@ export class DisclosureDetail extends React.Component {
             />
             <ActionButtons
               className={`${styles.override} ${styles.actionButtons}`}
-              showAttachments={this.props.disclosure.files.length > 0}
+              showAttachments={showAttachments}
               readonly={
                 this.props.disclosure.statusCd === COIConstants.DISCLOSURE_STATUS.UP_TO_DATE ||
                 this.props.disclosure.statusCd === COIConstants.DISCLOSURE_STATUS.UPDATES_REQUIRED

diff --git a/client/scripts/components/Admin/DetailView/UploadAttachmentsPanel/index.js b/client/scripts/components/Admin/DetailView/UploadAttachmentsPanel/index.js
@@ -0,0 +1,48 @@
+/*
+ The Conflict of Interest (COI) module of Kuali Research
+ Copyright © 2015 Kuali, Inc.
+
+ This program is free software: you can redistribute it and/or modify
+ it under the terms of the GNU Affero General Public License as
+ published by the Free Software Foundation, either version 3 of the
+ License, or (at your option) any later version.
+
+ This program is distributed in the hope that it will be useful,
+ but WITHOUT ANY WARRANTY; without even the implied warranty of
+ MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+ GNU Affero General Public License for more details.
+
+ You should have received a copy of the GNU Affero General Public License
+ along with this program.  If not, see <http://www.gnu.org/licenses/>
+ */
+
+import styles from './style';
+import React from 'react';
+import {AdminActions} from '../../../../actions/AdminActions';
+import {FileUpload} from '../../../FileUpload';
+import classNames from 'classnames';
+
+export default function UploadAttachmentsPanel(props) {
+  return (
+    <div className={classNames(styles.container, props.className)}>
+      <div className={styles.header}>
+        <span className={styles.close} onClick={AdminActions.hideUploadAttachmentsPanel}>
+          <i className="fa fa-times" style={{fontSize: 23}}></i> CLOSE
+        </span>
+        <span className={styles.title}>UPLOAD ATTACHMENTS</span>
+      </div>
+      <FileUpload
+        fileType='Admin'
+        readonly={props.readonly}
+        onDrop={AdminActions.addAdminAttachment}
+        delete={AdminActions.deleteAdminAttachment}
+        files={props.files}
+        multiple={true}
+        className={`${styles.override} ${styles.fileUploadStyles}`}
+      >
+        <div>Drag and drop or upload your management plan</div>
+        <div style={{fontSize: 10, marginTop: 2}}>Acceptable Formats: .pdf, .png, .doc, .jpeg</div>
+      </FileUpload>
+    </div>
+  );
+}
diff --git a/client/scripts/components/Admin/DetailView/UploadAttachmentsPanel/style.css b/client/scripts/components/Admin/DetailView/UploadAttachmentsPanel/style.css
@@ -0,0 +1,97 @@
+/*
+    The Conflict of Interest (COI) module of Kuali Research
+    Copyright © 2015 Kuali, Inc.
+
+    This program is free software: you can redistribute it and/or modify
+    it under the terms of the GNU Affero General Public License as
+    published by the Free Software Foundation, either version 3 of the
+    License, or (at your option) any later version.
+
+    This program is distributed in the hope that it will be useful,
+    but WITHOUT ANY WARRANTY; without even the implied warranty of
+    MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+    GNU Affero General Public License for more details.
+
+    You should have received a copy of the GNU Affero General Public License
+    along with this program.  If not, see <http://www.gnu.org/licenses/>
+*/
+
+.container {
+  padding: 25px 30px;
+  background-color: white;
+  height: 100%;
+  box-shadow: 0 0 10px 0 #AAA;
+}
+
+.close {
+  float: right;
+  font-weight: bold;
+  cursor: pointer;
+  margin-bottom: 8px;
+  color: #0095A0;
+  font-size: 20px;
+}
+
+:global(.color-blind) .close {
+  color: black;
+}
+
+.download {
+  float: right;
+  border: 0;
+  background-color: #333;
+  color: white;
+  padding: 5px 10px;
+}
+
+.dragAndDrop {
+  margin: 25px 0;
+  border: 3px dashed #888;
+  padding: 10px 15px;
+  border-radius: 4px;
+}
+
+.complete {
+  padding-bottom: 15px;
+  font-size: 14px;
+  vertical-align: middle;
+}
+
+.additionalReviewerLabel {
+  border-top: 1px solid #BBB;
+  padding-top: 25px;
+}
+
+.header {
+  border-bottom: 1px solid #777;
+  margin-bottom: 20px;
+  padding-bottom: 10px;
+}
+
+.searchLabel {
+  margin: 15px 0 5px 0;
+  font-size: 12px;
+  color: #666;
+}
+
+.searchBox {
+  width: 100%;
+  border: 1px solid #999;
+  padding: 10px 15px;
+}
+
+.title {
+  font-size: 22px;
+  font-weight: 300;
+}
+
+.subLabel {
+  font-size: 15px;
+  width: 50%;
+  border-bottom: 1px solid #777;
+  padding-bottom: 4px;
+}
+
+.override.fileUploadStyles {
+  font-size: 12px;
+}
diff --git a/client/scripts/components/FileUpload/index.js b/client/scripts/components/FileUpload/index.js
@@ -75,7 +75,7 @@ export class FileUpload extends React.Component {
         let deleteButton;
         if (!this.props.readonly) {
           deleteButton = (
-            <GreyButton onClick={this.onDelete} className={`${styles.override} ${styles.deleteButton}`} value={index}>DELETE FILE</GreyButton>
+            <GreyButton onClick={this.onDelete} className={`${styles.override} ${styles.deleteButton}`} value={file.id}>DELETE FILE</GreyButton>
           );
         }
 

diff --git a/client/scripts/components/User/Archive/ManagementPlan/index.js b/client/scripts/components/User/Archive/ManagementPlan/index.js
@@ -23,12 +23,12 @@ import {BlueButton} from '../../../BlueButton';
 export default function ManagementPlan(props) {
   return (
     <div className={styles.container}>
-        <span className={styles.header}>MANAGEMENT PLAN ATTACHED</span>
-        <a className={styles.downloadButtonLink} href={`/api/coi/files/${encodeURIComponent(props.fileId)}`}>
-            <span>
-              <BlueButton className={styles.button}>DOWNLOAD</BlueButton>
-            </span>
-        </a>
+      <span className={styles.header}>MANAGEMENT PLAN ATTACHED</span>
+      <a className={styles.downloadButtonLink} href={`/api/coi/files/${encodeURIComponent(props.fileId)}`}>
+        <span>
+          <BlueButton className={styles.button}>DOWNLOAD</BlueButton>
+        </span>
+      </a>
     </div>
   );
 }
diff --git a/client/scripts/components/User/Archive/ManagementPlan/style.css b/client/scripts/components/User/Archive/ManagementPlan/style.css
@@ -17,13 +17,13 @@
 */
 
 .container {
-background-color: #0095A0;
-  color:white;
-  width:100%;
-  min-height:40px;
+  background-color: #0095A0;
+  color: white;
+  width: 100%;
+  min-height: 40px;
   min-width: 500px;
-  display:inline-block;
-  padding: 8px 20px 0px 20px;
+  display: inline-block;
+  padding: 8px 20px 0 20px;
   z-index: 1;
 }
 
@@ -32,6 +32,7 @@ background-color: #0095A0;
   font-weight: 300;
   vertical-align: middle;
 }
+
 .downloadButtonLink {
   float: right;
 }
@@ -43,4 +44,4 @@ background-color: #0095A0;
 :global(.color-blind) .container {
   background-color: #333;
   border: 1px solid white;
-}
+}
diff --git a/client/scripts/components/User/Certification/Certify/index.js b/client/scripts/components/User/Certification/Certify/index.js
@@ -72,6 +72,10 @@ export class Certify extends React.Component {
         </div>
       );
     }
+
+    const disclosureFiles = this.props.files
+      .filter(file => file.file_type === COIConstants.FILE_TYPE.DISCLOSURE);
+
     return (
       <div className={classNames(styles.container, this.props.className)}>
         {instructions}
@@ -86,7 +90,7 @@ export class Certify extends React.Component {
               readOnly={false}
               onDrop={this.addDisclosureAttachment}
               delete={this.deleteDisclosureAttachment}
-              files={this.props.files}
+              files={disclosureFiles}
               multiple={true}
             >
               <div>Drag and Drop or Click to upload your attachments</div>