Fixes #49 - fix multiple attachments , get MS photo and added bidding…

… list status icon
SEARCAPhil · Aug 20, 2018 · 06bd5ef · 06bd5ef
1 parent 269bf42
commit 06bd5ef
Show file tree

Hide file tree

Showing 12 changed files with 98 additions and 30 deletions.
diff --git a/src/auth.html b/src/auth.html
@@ -27,7 +27,7 @@
     <meta name="msapplication-tap-highlight" content="no" />
     <meta name="viewport" content="user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width" />
     <!-- This is a wide open CSP declaration. To lock this down for production, see below. -->
-    <meta http-equiv="Content-Security-Policy" content="default-src * 'unsafe-inline' 'unsafe-eval'; style-src 'self' http://* 'unsafe-inline'; media-src *" />
+    <meta http-equiv="Content-Security-Policy" content="default-src * 'unsafe-inline' 'unsafe-eval'; img-src 'self' data:; style-src 'self' http://* 'unsafe-inline'; media-src *" />
     <!-- Good default declaration:
     * gap: is required only on iOS (when using UIWebView) and is needed for JS->native communication
     * https://ssl.gstatic.com is required only on Android and is needed for TalkBack to function properly

diff --git a/src/components/list-item/index.js b/src/components/list-item/index.js
@@ -16,7 +16,10 @@ export default class {
     this.template.innerHTML = `
       <style>${style.toString()}</style>
       <a href="#/bids/${opt.id}/info">
-        <h6 class="list-item-header">#${opt.id}</h6>
+        <h6 class="list-item-header">#${opt.id} 
+          ${opt.status == 3 ? '<span class="float-right"><i class="material-icons md-18" style="color:#8BC34A;">check_circle</i></span>' : ''}
+          ${opt.status == 5 ? '<span class="float-right"><i class="material-icons md-18 text-muted">lock</i></span>' : ''}
+        </h6>
         <small>
           <p style="font-size:smaller;" class="text-muted">
             ${opt.profile_name}<br/>

diff --git a/src/components/proposal-dialog/index.js b/src/components/proposal-dialog/index.js
@@ -204,7 +204,7 @@ export default class {
 
     this.getMenu().then(() => this.loadPopup ())
 
-    this.loadAttachments('.recently-attached-prop-section', this.__info.attachments)
+    this.loadAttachments(`#recently-attached-prop-section-${this.opt.id}`, this.__info.attachments)
 
   }
 
@@ -306,7 +306,7 @@ export default class {
         <p><b>DISCOUNT : <span id="prop-info-discount">${new Intl.NumberFormat('en-us').format(this.__info.discount)}</span></b></p>
       </small>
 
-      <div class="col-12 attachment-prop-pool-section row" id="attachment-prop-pool-section"></div>
+      <div class="col-12 attachment-prop-pool-section row" id="attachment-prop-pool-section-${this.opt.id}"></div>
       <hr/>
         <h5>
           <span class="header-circle"><i class="material-icons md-24">add_shopping_cart</i></span>

diff --git a/src/components/proposal-menu/actions/attach.js b/src/components/proposal-menu/actions/attach.js
@@ -28,7 +28,7 @@ export default class {
   }
 
   __appendFileToBeUploaded (e) {
-    const targ = document.querySelectorAll('.attachment-prop-pool-section')
+    const targ = document.querySelectorAll(`#attachment-prop-pool-section-${this.opt.id}`)
 
 		// close dialog
 		document.querySelector(`#file-attachment-main-dialog-${this.opt2.id}`).close()
@@ -60,15 +60,15 @@ export default class {
     const el = document.querySelector(opt.selector)
     const __proto = Object.assign({__proto__: this.__proto__}, this)
     el.opt = opt
-		el.removeEventListener('change', this.__appendFileToBeUploaded.bind(__proto))
+    el.classList.add('event-binded')
 		el.addEventListener('change', this.__appendFileToBeUploaded.bind(__proto))
   }
 
   /**
    * Attachment Components
    */
   loadAttachments (target, data) { 
-    import('../../attachments-item').then(res => {
+    import('../../proposal-attachments-item').then(res => {
       const targ = document.querySelector(target)
       if (!targ) return 0
       // append files
@@ -113,7 +113,7 @@ export default class {
           menus: ['remove']
         }
 
-				this.loadAttachments('.recently-attached-prop-section', [__payload])
+				this.loadAttachments(`#recently-attached-prop-section-${id}`, [__payload])
 				// more settings
 				setTimeout(() => {
           // dropdown and popup menu
@@ -149,7 +149,7 @@ export default class {
 
       setTimeout(() => {
         this.__bindSelectDeviceFile({
-          selector: '#file-upload-attachment-prop-modal',
+          selector: '#file-upload-attachment-prop-modal:not(.event-binded)',
         })
 
       },1000)
@@ -174,7 +174,7 @@ export default class {
                   <i class="material-icons md-48">cloud</i>
                   <h6>Upload files from your device</h6>
                   <label for="file-upload-attachment-prop-modal" class="btn btn-dark btn-sm">Select file <i class="material-icons md-18">attach_file</i></label>
-                  <input id="file-upload-attachment-prop-modal" name="file-upload-attachment[]" class="hide event-binded" type="file" multiple="">
+                  <input id="file-upload-attachment-prop-modal" name="file-upload-attachment[]" class="hide" type="file" multiple="">
               </center>  
             </div> 
         </div>

diff --git a/src/index.html b/src/index.html
@@ -27,7 +27,7 @@
     <meta name="msapplication-tap-highlight" content="no" />
     <meta name="viewport" content="user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width" />
     <!-- This is a wide open CSP declaration. To lock this down for production, see below. -->
-    <meta http-equiv="Content-Security-Policy" content="default-src * 'unsafe-inline' 'unsafe-eval'; style-src 'self' http://* 'unsafe-inline'; media-src *" />
+    <meta http-equiv="Content-Security-Policy" content="default-src * 'unsafe-inline' 'unsafe-eval'; img-src 'self' data:; style-src 'self' http://* 'unsafe-inline'; media-src *" />
     <!-- Good default declaration:
     * gap: is required only on iOS (when using UIWebView) and is needed for JS->native communication
     * https://ssl.gstatic.com is required only on Android and is needed for TalkBack to function properly

diff --git a/src/pages/auth-section/o365.js b/src/pages/auth-section/o365.js
@@ -61,7 +61,7 @@ const loginOnPremiseServer = (data) => {
 
 // authenticate to remote server
 const loginOnPremise = (data) => {
-  loginOnPremiseServer (data).then((json) => { 
+  loginOnPremiseServer (data).then((json) => {
       // account not yet verified
       if (!json.role) {
           window.location = 'authentication/confirmation.html'
@@ -76,6 +76,7 @@ const loginOnPremise = (data) => {
       window.localStorage.setItem('givenName', data.displayName)
       window.localStorage.setItem('department', data.department)
       window.localStorage.setItem('position', data.jobTitle)
+      window.localStorage.setItem('image', data.image)
       window.location = './#/home/'
 
   }).catch((err) => {
@@ -95,10 +96,32 @@ const getGraph = (token)  => {
   ).then(response => response.json()).catch((err) => {
       authError()
   }).then(data => {
-      // auth to onpremise
-      if(data.id) { 
-          loginOnPremise(data)
-      }
+    // auth to onpremise
+    if(data.id) { 
+
+        getImage(token).then(res => { 
+          res.blob().then(blob => {
+          // reader
+          let reader = new FileReader();
+          reader.readAsDataURL(blob); 
+          reader.onloadend = function() {
+            //let img = document.createElement('img')
+           // img.src = reader.result
+            data.image = reader.result
+            loginOnPremise(data)              
+          }
+
+        })
+      })
+    }
+  })
+}
+
+const getImage = (token) => {
+  //https://graph.microsoft.com/v1.0/me/photo/$value
+  return fetch('https://graph.microsoft.com/v1.0/me/photo/$value', { 
+    headers: {'Authorization':'Bearer '+token }, 
+    method: 'GET'
   })
 }
 

diff --git a/src/pages/bidding-info-section/actions.js b/src/pages/bidding-info-section/actions.js
@@ -134,7 +134,7 @@ const getBiddingList = (opt = {}) => {
         ListItem.then(item => {
           // items
           res.forEach((el, index) => {
-            const lItem = new item.default({class: 'col-12 list', id: el.id, profile_name: el.profile_name, date_created: el.date_created})
+            const lItem = new item.default({class: 'col-12 list', id: el.id, profile_name: el.profile_name, date_created: el.date_created, status: el.status})
             listSection.append(lItem)
           })
 

diff --git a/src/pages/invitation-info-section/index.js b/src/pages/invitation-info-section/index.js
@@ -33,6 +33,11 @@ class template {
   async render () {
     const net = (await Network).default
     const template = document.createElement('section')
+    const date = new Date()
+    const curMonth = (date.getMonth()+1) < 10 ? `0${date.getMonth()+1}` : (date.getMonth()+1)
+    const curD = date.getDate() < 10 ? `0${date.getDate()}` : date.getDate()
+    const currentDate = `${date.getFullYear()}-${curMonth}-${curD}`
+
     let __specs = ''
     let __attachments = ''
     this.__info = await this.__getInfo(this.__params.id)
@@ -75,7 +80,7 @@ class template {
           <b>Bidding Item #: </b> <span class="req-bidding-number">${this.__info.bidding_id}</span> <br/>
           <b>Reference #: </b> <span class="req-reference-number">${this.__info.id}</span> <br/>
           <span class="text-danger"><b>Quantity : </b> <span class="req-quantity">${this.__info.quantity}</span> <span class="req-unit">${this.__info.unit}</span></span> <br/>
-          <b>Deadline: </b> <span class="req-deadline">${this.__info.deadline}</span>
+          <b>Deadline: </b> <span class="${(currentDate > this.__info.deadline) ? 'text-danger' : 'text-primary'}">${this.__info.deadline != '0000-00-00' ? this.__info.deadline : 'Not Set'}</span>
         </p><br/>
 
         <!-- attachments-->

diff --git a/src/pages/requirement-proposal-section/actions/view.js b/src/pages/requirement-proposal-section/actions/view.js
@@ -46,10 +46,11 @@ export default class {
    *
    */
   __bind () {
-		const proto = Object.assign({ __proto__: this.__proto__ }, this)
-		const el = document.querySelectorAll(this.opt.selector)
+		const __proto = Object.assign({ __proto__: this.__proto__ }, this)
+		const el = document.querySelectorAll(`${this.opt.selector}:not(.event-binded)`)
 		el.forEach((els, index) => {
-			els.addEventListener('click',this.loadDialogPane.bind(proto))
+      els.classList.add('event-binded')
+			els.addEventListener('click', this.loadDialogPane.bind(__proto))
 		})
 	}
 

diff --git a/src/pages/requirement-proposal-section/index.js b/src/pages/requirement-proposal-section/index.js
@@ -92,7 +92,7 @@ export default class {
     // clear proposal list section
     if(isEmpty) __targ.forEach((el, index) => { el.innerHTML ='' })
 
-
+    
     data.forEach((val, index) => {
       let html = document.createElement('li')
       let status = ''
@@ -178,6 +178,11 @@ export default class {
 
     this.__info = await this.__getInfo(this.opt.id)
     const template = document.createElement('section')
+    const date = new Date()
+    const curMonth = (date.getMonth()+1) < 10 ? `0${date.getMonth()+1}` : (date.getMonth()+1)
+    const curD = date.getDate() < 10 ? `0${date.getDate()}` : date.getDate()
+    const currentDate = `${date.getFullYear()}-${curMonth}-${curD}`
+
 
     template.classList.add('col-lg-3')
     template.id = 'requirement-proposal-container'
@@ -186,7 +191,7 @@ export default class {
       <style>#requirement-proposal-container { background: #eee!important; padding-top: 100px; padding-bottom: 100px; height: 100vh; overflow-x:hidden; overflow-y:auto; border-left: 1px solid #ccc; }</style>
       <h5>Proposals</h5><hr/>
       
-      ${isSupplier() ?
+      ${(isSupplier() && currentDate <= this.__info.deadline) ?
       `<div class="col-12">
         <center>
           <p class="text-muted">
@@ -197,6 +202,16 @@ export default class {
         <hr/>
       </div>` : '' }
 
+      ${(currentDate > this.__info.deadline) ?
+        `<div class="col-12">
+          <center>
+            <p class="text-muted">
+              <i class="material-icons md-48">lock</i><br>
+              Sorry, this bidding is already closed. You are not allowed to bid on this item anymore. 
+          </center>
+          <hr/>
+        </div>` : '' }
+
       <section id="proposal-list-section" class="proposal-list-section">
         ${isCBAAsst() || isGSU() ?
           `<menu class="row col-12">

diff --git a/src/routers/index.js b/src/routers/index.js
@@ -10,6 +10,9 @@ const Menuselector = import('../utils/menu-selector')
 const loadHeader = () => {
   const MainHeader = import('../components/main-header')
   const ProfileLoader = import('../utils/profile-loader') 
+
+  if(document.querySelector('header > .nav')) return
+
   // header
   return MainHeader.then(res => {
     const headerSec =  document.querySelector('header')
@@ -21,10 +24,25 @@ const loadHeader = () => {
     // change visibility
     DisplayStyler.then(display => {
       display.default(['splash-page', '.list-bids-container'],'none')
+      setImage()
     })
   })
 }
 
+const setImage = () => {
+  const src = window.localStorage.getItem('image')
+  const headerSection = document.getElementById('image-header-section')
+
+  // User's information
+  document.getElementById('givenName-header-section').innerHTML = window.localStorage.getItem('givenName')	
+
+  if(!src) return headerSection.innerText = window.localStorage.getItem('givenName').substr(0,2).toUpperCase()
+  // change user info in DOM's header
+  headerSection.style.background = `url(${src}) center center no-repeat`
+  headerSection.style.backgroundSize = 'cover'
+
+}
+
 
 /**
  * Left Sidebar
@@ -124,6 +142,16 @@ Navigo.then((Navigo) => {
           Menuselector.then(loader => { new loader.default().active('feedback-menu-list') })
           import('./feedback')
         })
+     },
+   	'/supplier/*': ()=>{
+      // load components
+      loadHeader()
+      loadLeftSidebar().then(() => {
+        Menuselector.then(loader => { new loader.default().active('inv-menu-list') })
+        import('./invitation')
+      })
+      // dropdown
+      DropdownLoader.then(loader => loader.default('device-dropdown'))
      },
     '/logout/' : () => { 
       window.document.body.innerHTML = '<center><br/>loging out . . .</center>'

diff --git a/src/utils/profile-loader.js b/src/utils/profile-loader.js
@@ -12,11 +12,4 @@ export default () => {
 		alias: (window.localStorage.getItem('givenName') || '   ').substr(0,2).toUpperCase(),
 		department: window.localStorage.getItem('department'),
 	}
-    // change user info in DOM's header
-	setTimeout(() => {
-        // User's information
-		document.getElementById('givenName-header-section').innerHTML = window.localStorage.getItem('givenName')
-		document.getElementById('image-header-section').innerText = window.localStorage.getItem('givenName').substr(0,2).toUpperCase()
-		//window.bms.default.dropdown('device-dropdown')	
-	},1000)
 }