diff --git a/mobile/src/Activity/Activity.js b/mobile/src/Activity/Activity.js index 38686ae..7f2b2ed 100644 --- a/mobile/src/Activity/Activity.js +++ b/mobile/src/Activity/Activity.js @@ -20,13 +20,15 @@ import { BoundOptionStrip, BoundHeader, BoundPhotoPanel, + FormStaticInput, } from "../ui" import { MessageModal, WaitModal } from "../Modal" import autobind from "autobind-decorator" import KeyboardSpacer from "react-native-keyboard-spacer" import { isIphoneX } from "react-native-iphone-x-helper" import { api } from "../API" -import { formatLatLng, parseLatLng } from "../util" +import { formatLatLng } from "../util" +import moment from "moment" import "url-search-params-polyfill" const styles = StyleSheet.create({ @@ -57,13 +59,6 @@ export class Activity extends React.Component { noValue: true, isDisabled: (r) => !(r.anyModified && r.allValid), }, - dateTime: { - isValid: (r, v) => v !== "", - isReadOnly: true, - }, - details: { - isValid: (r, v) => v !== "", - }, resolution: { isValid: (r, v) => v !== "", }, @@ -72,14 +67,19 @@ export class Activity extends React.Component { }, photos: { isValid: (r, v) => v && v.length > 0, + initValue: [], }, status: { isValid: (r, v) => v !== "", alwaysGet: true, }, - location: { - isValid: (r, v) => v !== "", - isReadOnly: true, + workItem: { + isValid: true, + alwaysGet: true, + }, + team: { + isValid: true, + alwaysGet: true, }, } @@ -99,17 +99,26 @@ export class Activity extends React.Component { const getWorkItem = (id) => { api .getWorkItem(id) - .then((workitem) => { + .then((workItem) => { if (workItem) { const [lng, lat] = workItem.location.coordinates this.setState({ + binder: new FormBinder( + { + workItem: workItem._id, + team: api.loggedInUser.team, + }, + Activity.bindings + ), region: { latitude: lat, longitude: lng, latitudeDelta: 0.01, longitudeDelta: 0.01, }, + location: formatLatLng(lat, lng), + dateTime: moment().format(), }) } }) @@ -225,7 +234,14 @@ export class Activity extends React.Component { } render() { - const { binder, messageModal, waitModal, region } = this.state + const { + binder, + messageModal, + waitModal, + region, + dateTime, + location, + } = this.state return ( @@ -257,12 +273,8 @@ export class Activity extends React.Component { - - + + null } + const id = params.get("id") - if (search) { - const id = new URLSearchParams(search).get("id") - - if (id) { - api - .getWorkItem(id) - .then((workItem) => { - if (workItem) { - const [lng, lat] = workItem.location.coordinates - const region = { - latitude: lat, - longitude: lng, - latitudeDelta: 0.01, - longitudeDelta: 0.01, - } - - workItem.location = formatLatLng(lat, lng) - this.setState({ - binder: new FormBinder(workItem, WorkItem.bindings), - region, - }) + if (id) { + api + .getWorkItem(id) + .then((workItem) => { + if (workItem) { + const [lng, lat] = workItem.location.coordinates + const region = { + latitude: lat, + longitude: lng, + latitudeDelta: 0.01, + longitudeDelta: 0.01, } - }) - .catch((err) => { + + workItem.location = formatLatLng(lat, lng) this.setState({ - messageModal: { - icon: "hand", - message: "Unable to get work item details", - detail: err.message, - back: true, - }, + binder: new FormBinder(workItem, WorkItem.bindings), + region, }) + } + }) + .catch((err) => { + this.setState({ + messageModal: { + icon: "hand", + message: "Unable to get work item details", + detail: err.message, + back: true, + }, }) - } + }) } } @@ -219,6 +217,7 @@ export class WorkItem extends React.Component { if (this.addressInput) { this.addressInput.handleChangeText(address) } + this.setState({ region: ref.mapView.region }) }) .catch(() => { if (this.addressInput) { diff --git a/mobile/src/config.js b/mobile/src/config.js index 45d5293..ac41ef2 100644 --- a/mobile/src/config.js +++ b/mobile/src/config.js @@ -14,18 +14,18 @@ export const config = { minDistanceToItem: 10, geocodeDelayMilliseconds: 500, // This region is downtown Toronto - initialRegion: { - latitude: 43.653908, - longitude: -79.384293, - latitudeDelta: 0.0922, - longitudeDelta: 0.0421, - }, - // This region is Bainbridge Island // initialRegion: { - // latitude: 47.629536, - // longitude: -122.524162, + // latitude: 43.653908, + // longitude: -79.384293, // latitudeDelta: 0.0922, // longitudeDelta: 0.0421, // }, - // alwaysShowWorkItemInAR: true, + // This region is Bainbridge Island + initialRegion: { + latitude: 47.629536, + longitude: -122.524162, + latitudeDelta: 0.0922, + longitudeDelta: 0.0421, + }, + alwaysShowWorkItemInAR: true, } diff --git a/mobile/src/ui/BoundInput.js b/mobile/src/ui/BoundInput.js index 681a8f8..e528ad4 100644 --- a/mobile/src/ui/BoundInput.js +++ b/mobile/src/ui/BoundInput.js @@ -34,10 +34,10 @@ export class BoundInput extends React.Component { @autobind handleChangeText(newText) { - const { binder, name } = this.props - - if (binder) { - this.setState(binder.updateFieldValue(name, newText)) + if (this.props.binder) { + this.setState( + this.props.binder.updateFieldValue(this.props.name, newText) + ) } } diff --git a/mobile/src/ui/FormStaticInput.js b/mobile/src/ui/FormStaticInput.js new file mode 100644 index 0000000..f09e686 --- /dev/null +++ b/mobile/src/ui/FormStaticInput.js @@ -0,0 +1,46 @@ +import React from "react" +import PropTypes from "prop-types" +import { TextInput, Text, View, Platform } from "react-native" +import autobind from "autobind-decorator" + +export class FormStaticInput extends React.Component { + static propTypes = { + label: PropTypes.string, + value: PropTypes.string, + } + + render() { + const { label, value } = this.props + + return ( + + + {label} + + + + ) + } +} diff --git a/mobile/src/ui/index.js b/mobile/src/ui/index.js index 7a2c495..9805903 100644 --- a/mobile/src/ui/index.js +++ b/mobile/src/ui/index.js @@ -3,6 +3,7 @@ export { Header } from "./Header" export { OptionStrip } from "./OptionStrip" export { BoundSwitch } from "./BoundSwitch" export { BoundInput } from "./BoundInput" +export { FormStaticInput } from "./FormStaticInput" export { BoundButton } from "./BoundButton" export { BoundOptionStrip } from "./BoundOptionStrip" export { BoundHeader } from "./BoundHeader"