senaduka/old-new-wiaas
1
0
Fork 0
Code Issues Pull Requests 1 Actions Packages Projects Releases Wiki Activity

Handle wiaas documents

Browse Source
This commit is contained in:
Almira Krdzic
2018-10-03 16:46:41 +02:00
parent 6afffc7eca
commit 3ad210f883
42 changed files with 2258 additions and 258 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
frontend/src/containers/cart/CartStepsContainer.jsx
View File

@@ -38,7 +38,7 @@ class CartStepsContainer extends Component {
{(cartSteps && cartSteps[currentStep] && cartSteps[currentStep].previous && !isLoading) &&
<span onClick={()=>{this.handleStepChange('previous')}} className="prev-btn">
<Col sm="12" xs="12">
{cartTexts.buttons.PREVIOUS}
{cartTexts.buttons.BACK}
</Col>
</span>
}

10
frontend/src/containers/cart/CartUploadDocumentsContainer.jsx
View File

@@ -9,10 +9,10 @@ import {updateMessages} from '../../actions/notification/notificationActions';
import {nextStep, setNextActionFct} from '../../actions/cart/cartActions';
const DOCUMENT_TYPES = {
TEMPLATE_QUESTINNAIRE: 1,
QUESTIONNAIRE: 2,
TEMPLATE_AGREEMENT: 6,
AGREEMENT: 7
TEMPLATE_QUESTINNAIRE: 'template_questionaire',
QUESTIONNAIRE: 'order_questionaire',
TEMPLATE_AGREEMENT: 'template_agreement',
AGREEMENT: 'order_agreement'
};
class CartCustomerQuestionnaireContainer extends Component {
@@ -34,7 +34,7 @@ class CartCustomerQuestionnaireContainer extends Component {
}
handleStepChange() {
if(this.props.cartDocuments && this.props.cartDocuments.areFilesUploaded) {
if(this.props.cartDocuments && !this.props.cartDocuments.pending) {
this.props.dispatch(nextStep());
} else {
this.props.dispatch(updateMessages([{code:'warning', message: 'DOCS_MISSING'}], cartMessages));

71
frontend/src/containers/cart/components/CartUploadDocument.jsx
View File

@@ -6,11 +6,13 @@ import Dropzone from 'react-dropzone';
import {API_SERVER} from '../../../config';
import FileDownloader from '../../../helpers/FileDownloader';
import {cartTexts} from '../../../constants/cartConstants';
import {getDocumentIcon} from '../../../helpers/DocumentHelper';
import classnames from 'classnames';
const fileHandler = new FileDownloader();
const documentTypes = {
2 : 'Customer Questionnaire',
7 : 'Customer Agreement'
'order_questionaire' : 'Customer Questionnaire',
'order_agreement' : 'Customer Agreement'
};
class CartUploadDocument extends Component {
@@ -20,11 +22,11 @@ class CartUploadDocument extends Component {
this.uploadFile = this.uploadFile.bind(this);
}
uploadFile(idPackage, idDocumentType,acceptedFiles, rejectedFiles, packages){
uploadFile(packageCartKey, idDocumentType,acceptedFiles, rejectedFiles, packages){
const self = this;
acceptedFiles.forEach(file => {
self.props.dispatch(uploadOrderDocument(idPackage, idDocumentType, file, packages));
self.props.dispatch(uploadOrderDocument(packageCartKey, idDocumentType, file, packages));
});
if(rejectedFiles && rejectedFiles.length) {
@@ -33,9 +35,15 @@ class CartUploadDocument extends Component {
}
downloadDocument(document){
const fileUrl = `${API_SERVER}/utils/api/downloadFile?idDocument=${document.idDocument}&fileName=${document.documentName}.${document.extension}`
const fileName = document.documentName + '.' + document.extension;
fileHandler.download(fileUrl, fileName);
fileHandler.download(
`${API_SERVER}/wp-json/wiaas/cart/items/${this.props.cartItem.key}/documents/${this.props.idDocumentType}?document_key=${document.key}`,
document.name);
}
downloadTemplate(document) {
fileHandler.download(
`${API_SERVER}/wp-json/wiaas/documents?document_id=${document.id}`,
document.name);
}
render() {
@@ -45,30 +53,51 @@ class CartUploadDocument extends Component {
{
templateDocument &&
<div>
<Dropzone className="upload-file-drop-zone"
<div className="cart-template">
<p className="cart-subtitle">{documentTypes[idDocumentType]} {cartTexts.labels.TEMPLATE}:</p>
<p className="document-link" onClick={() => {this.downloadTemplate(templateDocument)}}>
<i className={`fa fa-${getDocumentIcon(templateDocument.extension)}`} aria-hidden="true"></i> {templateDocument.name}
</p>
</div>
<Dropzone className={classnames('upload-file-drop-zone', { 'pending-upload': !uploadedDocument })}
accept=".pdf,.docx,.doc,.xlsx,.xls,.odt,.ods"
onDrop={(acceptedFiles, rejectedFiles)=>{this.uploadFile(cartItem.idPackage, idDocumentType, acceptedFiles, rejectedFiles, packages)}}>
onDrop={(acceptedFiles, rejectedFiles)=>{this.uploadFile(cartItem.key, idDocumentType, acceptedFiles, rejectedFiles, packages)}}>
{
uploadedDocument
? <h6 className="drop-zone-text uploaded">{cartTexts.labels.FILE_UPLOADED_TEXT} {documentTypes[idDocumentType]} {cartTexts.labels.FILE}</h6>
: <h6 className="drop-zone-text">{cartTexts.labels.NO_FILE_UPLOAD_TEXT_1} {documentTypes[idDocumentType]} {cartTexts.labels.NO_FILE_UPLOAD_TEXT_2}</h6>
? (
<div>
<h1 className="drop-zone-icon">
<i className="fa fa-upload"></i>
</h1>
<h6 className="drop-zone-text">{uploadedDocument.name}</h6>
<span className="drop-zone-text">
Drag and drop or click to replace file
</span>
</div>
)
: (
<div>
<h1 className="drop-zone-icon pending-upload">
<i className="fa fa-upload"></i>
</h1>
<span className="drop-zone-text">
Drag and drop or click to upload file
</span>
</div>
)
}
</Dropzone>
{
uploadedDocument &&
<div>
<div className="cart-subtitle">{cartTexts.labels.UPLOADED}:</div>
<div className="document-link" onClick={() => {this.downloadDocument(uploadedDocument)}}>
<i className="fa fa-file" aria-hidden="true"></i>
{' ' + uploadedDocument.documentName + ' (' + uploadedDocument.extension + ')'}
</div>
<span className="document-link" onClick={() => {this.downloadDocument(uploadedDocument)}}>
<strong>
<i className={`fa fa-${getDocumentIcon(uploadedDocument.extension)}`} aria-hidden="true"></i> {uploadedDocument.name}
</strong>
</span>
</div>
}
<div className="cart-subtitle">{cartTexts.labels.TEMPLATES}:</div>
<div className="document-link" onClick={() => {this.downloadDocument(templateDocument)}}>
<i className="fa fa-file" aria-hidden="true"></i>
{' ' + templateDocument.documentName + ' (' + templateDocument.extension + ')'}
</div>
</div>
}

47
frontend/src/containers/cart/style/CartUploadDocumentsContainer.scss
View File

@@ -6,19 +6,37 @@
.upload-file-drop-zone {
width: 100%;
border: 3px dashed $borderColor;
margin-top: 1rem;
height: 5rem;
border: 1px dashed $borderColor;
margin: 1rem 0;
padding: 1rem;
cursor: pointer;
display: flex;
align-items: center;
justify-content: center;
text-align: center;
&:hover {
background-color: $lightHoverColor;
}
color: $font-light-color;
&.pending-upload {
border: 1px dashed $accentColor;
.drop-zone-icon, .drop-zone-text {
color: $accentColor;
}
}
}
.drop-zone-text {
text-align: center;
padding: 1.3rem 0.5rem;
color: $font-light-color;
padding: 0;
font-size: $font-size-small;
}
.uploaded {
color: #155724;
.drop-zone-icon {
color: #b3b3b3;
}
.next-btn {
@@ -28,18 +46,33 @@
color: $darkGreyColor;
}
.cart-template {
margin: 1rem 0;
.cart-subtitle {
margin-right: 1rem;
}
}
.cart-subtitle {
font-weight: $font-weight;
color: $font-light-color;
font-size: $font-size-small;
padding-top: 0.3rem;
}
}
.upload-layer{
background: $whiteColor;
padding-bottom: 1rem;
padding: 1rem;
color: $title-color;
.upload-layer {
color: $title-color;
}
.document-link{
cursor: pointer;
color: #2b6279;
}
}

10
frontend/src/containers/coMarket/components/PackageInfo.jsx
View File

@@ -8,9 +8,9 @@ const fileHandler = new FileDownloader();
class PackageInfo extends Component {
downloadDocument(document){
const fileUrl = `${API_SERVER}/wp-json/wiaas/download-package-file?document_id=${document.idDocument}&package_id=${document.idPackage}`
const fileName = document.documentName + '.' + document.extension;
fileHandler.download(fileUrl, fileName);
fileHandler.download(
`${API_SERVER}/wp-json/wiaas/documents?document_id=${document.id}`,
document.name);
}
render() {
@@ -41,9 +41,9 @@ class PackageInfo extends Component {
<div className="shop-package-label">{coMarketTexts.labels.DOCUMENTS}:</div>
{
documents.map((document) =>
<span key={document.idDocument} className="document-link"
<span key={document.id} className="document-link"
onClick={() => {this.downloadDocument(document)}}>
<i className="fa fa-file" aria-hidden="true"></i> {document.documentName} ({document.extension})
<i className={`fa fa-${document.icon}`} aria-hidden="true"></i> {document.name}
</span>
)
}

7
frontend/src/containers/orders/components/OrderDocuments.jsx
View File

@@ -10,7 +10,12 @@ class OrderDocuments extends Component {
return (
<div id="order-documents" className="order-documents">
{
orderInfo.packages.map(orderPackage => <OrderDocumentsGroup key={'order-package-' + orderPackage.id} documentsGroup={orderPackage} />)
orderInfo.packages.map(orderPackage => (
<OrderDocumentsGroup
key={'order-package-' + orderPackage.id}
orderId={orderInfo.id}
documentsGroup={orderPackage}
/>))
}
{
orderInfo.orderDocuments && <OrderDocumentsGroup key={'order-package-0'} documentsGroup={{documents: orderInfo.documents, packageName: orderTexts.labels.OTHER_DOCS}} />

42
frontend/src/containers/orders/components/OrderDocumentsGroup.jsx
View File

@@ -1,5 +1,4 @@
import React, {Component} from 'react';
import {Tooltip} from 'reactstrap';
import WiaasBox from '../../../mainComponents/box/WiaasBox.jsx';
import {API_SERVER} from '../../../config';
import FileDownloader from '../../../helpers/FileDownloader';
@@ -18,62 +17,39 @@ const iconTypes = {
xlsx: 'file-excel-o',
ppt: 'file-powerpoint-o',
pptx: 'file-powerpoint-o'
}
};
class OrderDocumentsGroup extends Component {
constructor(props) {
super(props);
this.toggle = this.toggle.bind(this);
this.state = {};
}
toggle(idDocument) {
const obj = {}
obj[idDocument] = !this.state[idDocument];
this.setState(obj);
}
getDocumentIcon(documentType) {
return iconTypes[documentType] || 'file';
}
getDocumentText(document) {
const name = document.documentName + '.' + document.extension;
return name.length > 9 ? name.substring(0, 10) + '...' : name;
}
downloadDocument(document){
const fileUrl = `${API_SERVER}/utils/api/downloadFile?idDocument=${document.idDocument}&fileName=${document.documentName}.${document.extension}&fileType=${document.documentTypeName}`
const fileName = document.documentName + '.' + document.extension;
fileHandler.download(fileUrl, fileName);
downloadDocument(orderId, itemId, document){
const fileUrl = `${API_SERVER}/wp-json/wiaas/documents/order/${orderId}/${document.type}?item_id=${itemId}&document_key=${document.key}`;
fileHandler.download(fileUrl, document.name);
}
render() {
const {documentsGroup} = this.props;
const {documentsGroup, orderId} = this.props;
return (
<div>
{
documentsGroup.documents &&
documentsGroup.documents.length > 0 &&
<WiaasBox mainTitle={documentsGroup.packageName}>
<WiaasBox mainTitle={documentsGroup.name}>
{
documentsGroup.documents.map(document => <a id={'document-' + document.idDocument} key={'order-document-' + document.idDocument}>
<div onClick={() => {this.downloadDocument(document)}} className="document-link-big">
documentsGroup.documents.map(document => <a id={'document-' + document.key} key={'order-document-' + document.key}>
<div onClick={() => {this.downloadDocument(orderId, documentsGroup.orderItemId, document)}} className="document-link-big">
<i className={'fa fa-4x fa-' + this.getDocumentIcon(document.extension)} aria-hidden="true"></i>
<div>
{this.getDocumentText(document)}
<Tooltip placement="bottom"
delay={{ show: 0, hide: 0}}
container="order-documents"
isOpen={this.state[document.idDocument]}
target={'document-' + document.idDocument}
toggle={()=>this.toggle(document.idDocument)}>
{document.documentName} ({document.extension})
</Tooltip>
{document.name}
</div>
</div></a>)
}