@plusscommunities/pluss-maintenance-app 7.0.0 → 7.0.2

package/dist/module/screens/ServiceRequest.js

@@ -92,7 +92,7 @@ class MaintenanceRequest extends Component {
       }
       this.setState(update);
     });
-    _defineProperty(this, "onUploadStarted", (uploadUri, imageUri) => {
+    _defineProperty(this, "onUploadStartedImage", (uploadUri, imageUri) => {
       const {
         imageFieldId
       } = this.state;
@@ -106,7 +106,7 @@ class MaintenanceRequest extends Component {
       });
       this.setImages(imagesUpdate, imageFieldId);
     });
-    _defineProperty(this, "onUploadProgress", progress => {
+    _defineProperty(this, "onUploadProgressImage", progress => {
       const {
         imageFieldId
       } = this.state;
@@ -120,7 +120,7 @@ class MaintenanceRequest extends Component {
       });
       this.setImages(imagesUpdate, imageFieldId);
     });
-    _defineProperty(this, "onUploadSuccess", async (uri, uploadUri) => {
+    _defineProperty(this, "onUploadSuccessImage", async (uri, uploadUri) => {
       const {
         imageFieldId
       } = this.state;
@@ -135,7 +135,7 @@ class MaintenanceRequest extends Component {
       });
       this.setImages(imagesUpdate, imageFieldId, () => this.waitForThumbnails());
     });
-    _defineProperty(this, "onUploadFailed", uploadUri => {
+    _defineProperty(this, "onUploadFailedImage", uploadUri => {
       const {
         imageFieldId
       } = this.state;
@@ -163,6 +163,53 @@ class MaintenanceRequest extends Component {
       });
       this.setImages(imagesUpdate, imageFieldId);
     });
+    _defineProperty(this, "onUploadStartedDocument", (uploadUri, documentUri, documentName, documentExt, documentFieldId) => {
+      const documentsUpdate = this.getDocuments(documentFieldId);
+      documentsUpdate.splice(documentsUpdate.length - 1, 0, {
+        uploading: true,
+        uploadProgress: '0%',
+        uploadUri,
+        documentUri,
+        documentName,
+        documentExt,
+        allowRetry: true
+      });
+      this.setDocuments(documentsUpdate, documentFieldId);
+    });
+    _defineProperty(this, "onUploadProgressDocument", (progress, documentFieldId) => {
+      const documentsUpdate = this.getDocuments(documentFieldId);
+      documentsUpdate.map(doc => {
+        if (doc.uploadUri === progress.uri) {
+          doc.uploadProgress = progress.percentage;
+          doc.uploading = true;
+          doc.allowRetry = true;
+        }
+      });
+      this.setDocuments(documentsUpdate, documentFieldId);
+    });
+    _defineProperty(this, "onUploadSuccessDocument", async (uri, uploadUri, documentFieldId) => {
+      const documentsUpdate = this.getDocuments(documentFieldId);
+      documentsUpdate.map(doc => {
+        if (doc.uploadUri === uploadUri && doc.uploading) {
+          doc.uploading = false;
+          doc.uploadProgress = '100%';
+          doc.url = uri;
+          doc.allowRetry = true;
+        }
+      });
+      this.setDocuments(documentsUpdate, documentFieldId);
+    });
+    _defineProperty(this, "onUploadFailedDocument", (uploadUri, documentFieldId) => {
+      const documentsUpdate = this.getDocuments(documentFieldId);
+      documentsUpdate.map(doc => {
+        if (doc.uploadUri === uploadUri) {
+          doc.uploading = true; // Requried for retry
+          doc.uploadProgress = '';
+          doc.allowRetry = true;
+        }
+      });
+      this.setDocuments(documentsUpdate, documentFieldId);
+    });
     _defineProperty(this, "isFieldValid", (field, fieldId) => {
       const {
         mandatory,
@@ -170,14 +217,17 @@ class MaintenanceRequest extends Component {
         answer
       } = field;
       if (['staticTitle', 'staticText'].includes(type)) return true;
-      const imagesList = type === 'image' ? this.getImageUrls(fieldId) : [];
       const checkMandatory = () => {
         if (!mandatory) return true;
         switch (type) {
           case 'yn':
             return _.isBoolean(answer);
           case 'image':
+            const imagesList = this.getImageUrls(fieldId);
             return imagesList.length > 0;
+          case 'document':
+            const documentsList = this.getDocumentAnswers(fieldId);
+            return documentsList.length > 0;
           case 'checkbox':
             return _.isArray(answer) && answer.length > 0;
           default:
@@ -229,6 +279,7 @@ class MaintenanceRequest extends Component {
       const customFields = _.cloneDeep(this.state.customFields);
       const updatedCustomFields = customFields.map((field, fieldId) => {
         if (field.type === 'image') field.answer = this.getImageUrls(fieldId);
+        if (field.type === 'document') field.answer = this.getDocumentAnswers(fieldId);
         return field;
       });
       maintenanceActions.sendMaintenanceRequest(this.props.uid, this.state.userName, this.state.phone, this.state.roomNumber, this.state.title, description, null, this.state.type, images, Helper.getSite(this.props.site), this.state.isHome, this.state.times, updatedCustomFields).then(res => {
@@ -343,6 +394,39 @@ class MaintenanceRequest extends Component {
       imagesUpdate.splice(index, 1);
       this.setImages(imagesUpdate, fieldId);
     });
+    _defineProperty(this, "getDocuments", fieldId => {
+      const {
+        customFieldDocuments
+      } = this.state;
+      const documentsList = _.cloneDeep(customFieldDocuments[fieldId]) || [];
+      return documentsList;
+    });
+    _defineProperty(this, "setDocuments", (documentsList, fieldId) => {
+      let update = {};
+      const customFieldDocuments = _.cloneDeep(this.state.customFieldDocuments);
+      customFieldDocuments[fieldId] = documentsList;
+      update = {
+        customFieldDocuments
+      };
+      this.setState(update);
+    });
+    _defineProperty(this, "getDocumentAnswers", fieldId => {
+      const documentsList = this.getDocuments(fieldId);
+      return _.filter(documentsList, doc => {
+        return !doc.uploading && doc.url;
+      }).map(doc => {
+        return {
+          name: doc.documentName,
+          ext: doc.documentExt,
+          url: doc.url
+        };
+      });
+    });
+    _defineProperty(this, "removeDocument", (index, fieldId) => {
+      const documentsUpdate = this.getDocuments(fieldId);
+      documentsUpdate.splice(index, 1);
+      this.setDocuments(documentsUpdate, fieldId);
+    });
     _defineProperty(this, "toggleFullscreenVideo", url => {
       if (typeof url !== 'string') url = '';
       this.setState({
@@ -375,6 +459,7 @@ class MaintenanceRequest extends Component {
       confirmationToShow: false,
       customFields: [],
       customFieldImages: {},
+      customFieldDocuments: {},
       isDateTimePickerVisible: false,
       popUpType: 'date',
       dateFieldId: null,
@@ -433,6 +518,7 @@ class MaintenanceRequest extends Component {
       fail: false,
       customFields: [],
       customFieldImages: {},
+      customFieldDocuments: {},
       isDateTimePickerVisible: false,
       popUpType: 'date',
       dateFieldId: null,
@@ -444,7 +530,6 @@ class MaintenanceRequest extends Component {
       this.setState({
         types: res.data
       });
-      console.log(res.data);
       this.getDefaultJob();
     }).catch(() => {});
   }
@@ -454,7 +539,6 @@ class MaintenanceRequest extends Component {
     } = this.state;
     const selected = types.find(t => t.typeName === type) || {};
     if (values.forceCustomFields && !selected.hasCustomFields) {
-      console.log(selected);
       this.setState({
         type,
         customFields: [],
@@ -540,14 +624,14 @@ class MaintenanceRequest extends Component {
     }
     this.submit();
   }
-  renderUploadMenu() {
+  renderImageUploader() {
     return /*#__PURE__*/React.createElement(Components.ImageUploader, {
       ref: ref => this.imageUploader = ref,
-      onUploadStarted: this.onUploadStarted,
-      onUploadSuccess: this.onUploadSuccess,
-      onUploadFailed: this.onUploadFailed,
-      onUploadProgress: this.onUploadProgress,
-      onLibrarySelected: this.onLibrarySelected,
+      onUploadStarted: this.onUploadStartedImage,
+      onUploadSuccess: this.onUploadSuccessImage,
+      onUploadFailed: this.onUploadFailedImage,
+      onUploadProgress: this.onUploadProgressImage,
+      onLibrarySelected: this.onLibrarySelectedImage,
       size: {
         width: 1400
       },
@@ -612,6 +696,34 @@ class MaintenanceRequest extends Component {
       style: styles.removeImage
     }))));
   }
+  renderDocument(item, index, fieldId) {
+    const {
+      colourBrandingMain
+    } = this.props;
+    return /*#__PURE__*/React.createElement(View, {
+      key: index,
+      style: styles.documentContainer
+    }, /*#__PURE__*/React.createElement(View, {
+      style: {
+        ...styles.documentTypeContainer,
+        backgroundColor: colourBrandingMain
+      }
+    }, /*#__PURE__*/React.createElement(Text, {
+      style: styles.documentTypeText
+    }, item.documentExt)), /*#__PURE__*/React.createElement(Text, {
+      style: styles.documentText
+    }, `${item.documentName}${item.uploading ? ` - ${item.uploadProgress}` : ''}`), !item.uploading && /*#__PURE__*/React.createElement(TouchableOpacity, {
+      style: styles.removeDocumentButton,
+      onPress: () => this.removeDocument(index, fieldId)
+    }, /*#__PURE__*/React.createElement(Icon, {
+      name: "remove",
+      type: "font-awesome",
+      iconStyle: {
+        ...styles.removeDocumentIcon,
+        color: colourBrandingMain
+      }
+    })));
+  }
   renderSuccess() {
     return /*#__PURE__*/React.createElement(View, {
       style: {
@@ -626,8 +738,6 @@ class MaintenanceRequest extends Component {
   renderImageList(fieldId = null) {
     const imagesList = this.getImages(fieldId);
     return /*#__PURE__*/React.createElement(View, {
-      style: styles.imageSection
-    }, /*#__PURE__*/React.createElement(View, {
       style: [styles.imageListContainer, imagesList.length < 2 && styles.imageListContainerEmpty]
     }, /*#__PURE__*/React.createElement(FlatList, {
       keyboardShouldPersistTaps: "always",
@@ -639,8 +749,30 @@ class MaintenanceRequest extends Component {
       }) => this.renderImage(item, index, fieldId),
       keyExtractor: (item, index) => index,
       numColumns: 3
-    })));
+    }));
   }
+
+  // renderDocumentList(fieldId) {
+  //   const documentsList = this.getDocuments(fieldId);
+  //   return (
+  //     <View style={styles.documentListContainer}>
+  //       {documentsList.length > 0 ? documentsList.map((document, index) => this.renderDocument(document, index, fieldId)) : null}
+  //       <Components.DocumentUploader
+  //         buttonTitle="Add Files"
+  //         allowedTypes={['application/pdf']}
+  //         onUploadStarted={(uploadUri, uri, name, ext) => this.onUploadStartedDocument(uploadUri, uri, name, ext, fieldId)}
+  //         onUploadProgress={progress => this.onUploadProgressDocument(progress, fieldId)}
+  //         onUploadSuccess={(uri, uploadUri) => this.onUploadSuccessDocument(uri, uploadUri, fieldId)}
+  //         onUploadFailed={uploadUri => this.onUploadFailedDocument(uploadUri, fieldId)}
+  //         fileName="serviceDocument"
+  //         userId={this.props.uid}
+  //         disabled={false}
+  //         multiple
+  //       />
+  //     </View>
+  //   );
+  // }
+
   renderDateField(field, fieldId, sectionStyle) {
     let displayText, placeHolder, icon, errorText;
     if (field.type === 'date') {
@@ -793,6 +925,19 @@ class MaintenanceRequest extends Component {
           required: field.mandatory,
           showError: this.state.showError
         }, this.renderImageList(fieldId));
+      // case 'document':
+      //   return (
+      //     <Components.GenericInputSection
+      //       key={fieldId}
+      //       label={field.label}
+      //       sectionStyle={sectionStyle}
+      //       isValid={() => this.isFieldValid(field, fieldId)}
+      //       required={field.mandatory}
+      //       showError={this.state.showError}
+      //     >
+      //       {this.renderDocumentList(fieldId)}
+      //     </Components.GenericInputSection>
+      //   );
       default:
         return null;
     }
@@ -1034,7 +1179,7 @@ class MaintenanceRequest extends Component {
     return /*#__PURE__*/React.createElement(KeyboardAvoidingView, {
       behavior: Platform.OS === 'ios' && 'padding',
       style: styles.viewContainer
-    }, this.renderUploadMenu(), /*#__PURE__*/React.createElement(View, {
+    }, this.renderImageUploader(), /*#__PURE__*/React.createElement(View, {
       style: styles.container
     }, /*#__PURE__*/React.createElement(Components.Header, {
       leftIcon: "angle-left",
@@ -1092,6 +1237,11 @@ const styles = {
     alignItems: 'center',
     flexDirection: 'column'
   },
+  documentListContainer: {
+    marginTop: 8,
+    flexDirection: 'column',
+    alignItems: 'flex-start'
+  },
   imageContainer: {
     width: PHOTO_SIZE,
     height: PHOTO_SIZE,
@@ -1219,6 +1369,42 @@ const styles = {
   removeIcon: {
     fontSize: 26,
     color: Colours.TEXT_BLUEGREY
+  },
+  documentContainer: {
+    flexDirection: 'row',
+    alignItems: 'center',
+    justifyContent: 'space-between',
+    paddingVertical: 4
+  },
+  documentTypeContainer: {
+    width: 50,
+    height: 60,
+    justifyContent: 'center',
+    alignItems: 'center',
+    borderRadius: 5,
+    marginRight: 8
+  },
+  documentTypeText: {
+    color: '#fff',
+    fontFamily: 'sf-semibold',
+    textAlign: 'center'
+  },
+  documentText: {
+    flex: 1,
+    fontFamily: 'sf-semibold',
+    fontSize: 16,
+    color: '#65686D'
+  },
+  removeDocumentButton: {
+    padding: 4,
+    width: 40,
+    height: 40,
+    alignItems: 'center',
+    justifyContent: 'center',
+    marginLeft: 8
+  },
+  removeDocumentIcon: {
+    fontSize: 24
   }
 };
 const mapStateToProps = state => {