Skip to content

GitLab

Commit 59d76d92 authored by santhosh's avatar santhosh
Browse files

zoom chat image

parents 9e803539 a333eff6
No related merge requests found
Expand all Hide whitespace changes
Inline Side-by-side
Showing
with 359 additions and 252 deletions
+359 -252
package-lock.json
View file @ 59d76d92
......@@ -13396,6 +13396,11 @@
"resolved": "https://registry.npmjs.org/react-native-image-crop-picker/-/react-native-image-crop-picker-0.37.2.tgz",
"integrity": "sha512-YwZXW21Km8+3tSt0smTaLVgY4398c0/OJcpcH6EP0JDOt1BNNxl/R8m6qdvnwdXdIoa0CCnMVW6TL9IN5ia9OA=="
},
"react-native-image-pan-zoom": {
"version": "2.1.12",
"resolved": "https://registry.npmjs.org/react-native-image-pan-zoom/-/react-native-image-pan-zoom-2.1.12.tgz",
"integrity": "sha512-BF66XeP6dzuANsPmmFsJshM2Jyh/Mo1t8FsGc1L9Q9/sVP8MJULDabB1hms+eAoqgtyhMr5BuXV3E1hJ5U5H6Q=="
},
"react-native-image-picker": {
"version": "4.7.3",
"resolved": "https://registry.npmjs.org/react-native-image-picker/-/react-native-image-picker-4.7.3.tgz",
......
src/CommonComponents/AdminChatUser.js
View file @ 59d76d92
This diff is collapsed.
src/CommonComponents/Comments.js
View file @ 59d76d92
......@@ -309,11 +309,11 @@ export default class AddMainTask extends React.Component {
this.props.navigation.goBack(null)} />
</Left>
<Body style={{ width: wp('80%') }}>
<Title style={{ color: '#fff', fontWeight: '600' }}>UserStory/Backlog History</Title>
{/* <Body style={{ width: wp('100%') }}> */}
<Text style={{ color: '#fff', fontWeight: '600',marginTop:25,marginRight:150 }}>UserStory/Backlog History</Text>
{/* <Subtitle style={{ color: '#fff', fontWeight: '600' }}>{this.state.moduledesc}</Subtitle> */}
</Body>
<Right></Right>
{/* </Body> */}
{/* <Right></Right> */}
</Header>
<View style={styles.MainContainer}>
<NavigationEvents
......
src/CommonComponents/EmployeeInfo.js
View file @ 59d76d92
......@@ -292,7 +292,7 @@ export default class EmployeeInfo extends Component {
</ View>
</View>
<View style={{ paddingTop: 20 }}>
<View style={{ height: hp('20%') }}>
<View style={{ height: hp('18%') }}>
<View style={{ flexDirection: 'row', justifyContent: 'space-between' }}>
<View style={{ paddingLeft: 20 ,flexDirection:'row'}}>
<TouchableOpacity onPress={() => this.props.navigation.navigate('ManageProjects', { empId: this.props.navigation.state.params.empId, emp_role: this.props.navigation.state.params.role })}>
......@@ -322,7 +322,7 @@ export default class EmployeeInfo extends Component {
</View>
<View style={{ paddingTop: 20 }}>
<View style={{ height: hp('20%') }}>
<View style={{ height: hp('18%') }}>
<View style={{ flexDirection: 'row', justifyContent: 'space-between' }}>
<View style={{ paddingLeft: 20 }}>
<TouchableOpacity onPress={() => this.UserCheck()}>
......@@ -354,7 +354,7 @@ export default class EmployeeInfo extends Component {
</View>
<View style={{ paddingTop: 20 }}>
<View style={{ height: hp('20%') }}>
<View style={{ height: hp('18%') }}>
<View style={{ flexDirection: 'row', justifyContent: 'space-between' }}>
<View style={{ paddingLeft: 20 ,flexDirection:'row'}}>
<TouchableOpacity onPress={() => this.props.navigation.navigate('KudosPoints', { empId: this.props.navigation.state.params.empId, emp_role: this.props.navigation.state.params.role })}>
......
src/CommonComponents/GroupChat.js
View file @ 59d76d92
......@@ -35,6 +35,7 @@ import { EMPLOYEEID } from './Header';
import moment from "moment";
import { DataTable } from 'react-native-paper';
import { launchCamera, launchImageLibrary } from 'react-native-image-picker';
import ImageZoom from 'react-native-image-pan-zoom';
const options = {
title: 'Select Image',
......@@ -66,6 +67,7 @@ export default class GroupChat extends Component {
handleHover: false,
commentDetails: {},
SendImg: false,
open: false
};
}
......@@ -77,6 +79,22 @@ export default class GroupChat extends Component {
// this.groupMembersEmail();//Getting the List of GroupMembers Emails
// alert(this.props.navigation.state.params.sno)
}
openModal = (item) => {
// alert(JSON.stringify(item))
this.setState({
open: true,
image: item
})
}
imageClose = () => {
this.setState({
open: false,
})
}
//getting task related group members added by naveen
groupMembersList() {
log("Info", " groupMembersList(role, userToken, cropcode) is used getting task related group members");
......@@ -806,102 +824,143 @@ export default class GroupChat extends Component {
</Header>
{/* <KeyboardAvoidingView> */}
<View style={styles.container}>
<ScrollView
horizontal={true}
showsHorizontalScrollIndicator={false}
// ref={ref => { this.scrollView = ref }}
// onContentSizeChange={() => this.scrollView.scrollToEnd({ y: 0, animated: false })}
>
<FlatList style={styles.list}
inverted
data={this.state.dataSource}
keyExtractor={(item) => {
return item.id;
}}
renderItem={(message) => {
const item = message.item;
let inMessage = item.messagedBy === this.state.userid;
let itemStyleSingle = !inMessage ? styles.itemInSingle : styles.itemOutSingle;
let itemStyle = !inMessage ? styles.itemIn : styles.itemOut;
let itemStyleReply = !inMessage ? styles.itemInReply : styles.itemOutReply;
// const left = <View style={{flexDirection:'row'}}><Text style={{ fontSize: 12, color: 'orange' }}>{item.username}</Text><Icon color={'#C0C0C0'} size={25} style={{ marginLeft: 10 }} name="reply" /></View>
// const right = <View style={{flexDirection:'row'}}><Text style={{ fontSize: 12, color: 'blue' }}>{item.username}</Text><Icon color={'#C0C0C0'} size={25} style={{ marginLeft: 10 }} name="reply" /></View>
return (
<ScrollView>
{ item.reply_message !== null ?
<View>
<View style={[styles.itemReply, itemStyleReply]}>
<View style={{ padding: 5, }}>
{itemStyle === styles.itemOut ? <View style={{ flexDirection: 'row' }}><Text style={{ fontSize: 12, color: 'orange' }}>{item.reply_username}</Text></View> : <View style={{ flexDirection: 'row' }}><Text style={{ fontSize: 12, color: 'blue' }}>{item.username}</Text></View>}
{item.reply_path !== "" ? <Image source={{ uri: item.reply_path }} style={{ width: 210, height: 50 }} /> : null}
<Text style={{width:210}} selectable={true} key={Math.random()}>{item.reply_message}</Text>
{!inMessage && this.renderDate(moment(item.messagedTime).format('MM.DD.YYYY hh:mm:ss'))}
{inMessage && this.renderDate(moment(item.messagedTime).format('MM.DD.YYYY hh:mm:ss'))}
{this.state.open === true ?
<View style={{ flex: 1, alignItems: "center", height: '100%', width: '100%', justifyContent: 'center' }}>
<ImageZoom
cropWidth={Dimensions.get('window').width}
cropHeight={600}
imageWidth={600}
imageHeight={600}>
<Image source={{ uri: this.state.image.path }} resizeMode='contain' style={{ width: "90%", height: "80%", }} />
</ImageZoom>
<TouchableOpacity onPress={() => this.imageClose()} ><Text>Close</Text></TouchableOpacity>
</View> :
<View style={styles.container}>
<ScrollView
horizontal={true}
showsHorizontalScrollIndicator={false}
// ref={ref => { this.scrollView = ref }}
// onContentSizeChange={() => this.scrollView.scrollToEnd({ y: 0, animated: false })}
>
<FlatList style={styles.list}
inverted
data={this.state.dataSource}
keyExtractor={(item) => {
return item.id;
}}
renderItem={(message) => {
const item = message.item;
let inMessage = item.messagedBy === this.state.userid;
let itemStyleSingle = !inMessage ? styles.itemInSingle : styles.itemOutSingle;
let itemStyle = !inMessage ? styles.itemIn : styles.itemOut;
let itemStyleReply = !inMessage ? styles.itemInReply : styles.itemOutReply;
// const left = <View style={{flexDirection:'row'}}><Text style={{ fontSize: 12, color: 'orange' }}>{item.username}</Text><Icon color={'#C0C0C0'} size={25} style={{ marginLeft: 10 }} name="reply" /></View>
// const right = <View style={{flexDirection:'row'}}><Text style={{ fontSize: 12, color: 'blue' }}>{item.username}</Text><Icon color={'#C0C0C0'} size={25} style={{ marginLeft: 10 }} name="reply" /></View>
return (
<ScrollView>
{ item.reply_message !== null ?
<View>
<View style={[styles.itemReply, itemStyleReply]}>
<View style={{ padding: 5, }}>
{itemStyle === styles.itemOut ? <View style={{ flexDirection: 'row' }}><Text style={{ fontSize: 12, color: 'orange' }}>{item.reply_username}</Text></View> : <View style={{ flexDirection: 'row' }}><Text style={{ fontSize: 12, color: 'blue' }}>{item.username}</Text></View>}
{item.reply_path !== "" ? <TouchableOpacity onPress={() => this.openModal(item)} ><Image source={{ uri: item.reply_path }} style={{ width: 210, height: 50 }} /></TouchableOpacity> : null}
<Text style={{ width: 210 }} selectable={true} key={Math.random()}>{item.reply_message}</Text>
{!inMessage && this.renderDate(moment(item.messagedTime).format('MM.DD.YYYY hh:mm:ss'))}
{inMessage && this.renderDate(moment(item.messagedTime).format('MM.DD.YYYY hh:mm:ss'))}
</View>
</View>
</View>
<View style={[styles.item, itemStyle]}>
<View style={[styles.item, itemStyle]}>
<View style={{ padding: 5, }}>
{itemStyle === styles.itemOut ? <View style={{ flexDirection: 'row' }}><Text style={{ fontSize: 12, color: 'orange' }}>{item.username}</Text><TouchableOpacity onPress={() => this.handlecom(item)} ><Icon color={'#C0C0C0'} size={25} style={{ marginLeft: 10 }} name="reply" /></TouchableOpacity></View> : <View style={{ flexDirection: 'row' }}><Text style={{ fontSize: 12, color: 'blue' }}>{item.username}</Text><TouchableOpacity onPress={() => this.handlecom(item)} ><Icon color={'#C0C0C0'} size={25} style={{ marginLeft: 10 }} name="reply" /></TouchableOpacity></View>}
{item.path !== "" ? <TouchableOpacity onPress={() => this.openModal(item)} ><Image source={{ uri: item.path }} style={styles.imageview} /></TouchableOpacity> : null}
<Text style={{ width: 210 }} selectable={true} key={Math.random()}>{item.message}</Text>
{!inMessage && this.renderDate(moment(item.messagedTime).format('MM.DD.YYYY hh:mm:ss'))}
{inMessage && this.renderDate(moment(item.messagedTime).format('MM.DD.YYYY hh:mm:ss'))}
</View>
</View>
</View>
:
// <Text>hello</Text>
<View style={[styles.itemSingle, itemStyleSingle]}>
<View style={{ padding: 5, }}>
{itemStyle === styles.itemOut ? <View style={{ flexDirection: 'row' }}><Text style={{ fontSize: 12, color: 'orange' }}>{item.username}</Text><TouchableOpacity onPress={() => this.handlecom(item)} ><Icon color={'#C0C0C0'} size={25} style={{ marginLeft: 10 }} name="reply" /></TouchableOpacity></View> : <View style={{ flexDirection: 'row' }}><Text style={{ fontSize: 12, color: 'blue' }}>{item.username}</Text><TouchableOpacity onPress={() => this.handlecom(item)} ><Icon color={'#C0C0C0'} size={25} style={{ marginLeft: 10 }} name="reply" /></TouchableOpacity></View>}
{item.path !== "" ? <Image source={{ uri: item.path }} style={styles.imageview} /> : null}
<Text style={{width:210}} selectable={true} key={Math.random()}>{item.message}</Text>
{item.path !== "" ? <TouchableOpacity onPress={() => this.openModal(item)} ><Image source={{ uri: item.path }} style={styles.imageview} /></TouchableOpacity> : null}
<Text style={{ width: 210 }} selectable={true} key={Math.random()}>{item.message}</Text>
{!inMessage && this.renderDate(moment(item.messagedTime).format('MM.DD.YYYY hh:mm:ss'))}
{inMessage && this.renderDate(moment(item.messagedTime).format('MM.DD.YYYY hh:mm:ss'))}
</View>
</View>
</View>
:
// <Text>hello</Text>
<View style={[styles.itemSingle, itemStyleSingle]}>
<View style={{ padding: 5, }}>
{itemStyle === styles.itemOut ? <View style={{ flexDirection: 'row' }}><Text style={{ fontSize: 12, color: 'orange' }}>{item.username}</Text><TouchableOpacity onPress={() => this.handlecom(item)} ><Icon color={'#C0C0C0'} size={25} style={{ marginLeft: 10 }} name="reply" /></TouchableOpacity></View> : <View style={{ flexDirection: 'row' }}><Text style={{ fontSize: 12, color: 'blue' }}>{item.username}</Text><TouchableOpacity onPress={() => this.handlecom(item)} ><Icon color={'#C0C0C0'} size={25} style={{ marginLeft: 10 }} name="reply" /></TouchableOpacity></View>}
{item.path !== "" ? <Image source={{ uri: item.path }} style={styles.imageview} /> : null}
<Text style={{width:210}} selectable={true} key={Math.random()}>{item.message}</Text>
{!inMessage && this.renderDate(moment(item.messagedTime).format('MM.DD.YYYY hh:mm:ss'))}
{inMessage && this.renderDate(moment(item.messagedTime).format('MM.DD.YYYY hh:mm:ss'))}
</View>
</View>
}
</ScrollView>
)
}} />
</ScrollView>
{this.state.uri && <View style={{ width: "100%", height: 100, backgroundColor: 'grey', flexDirection: 'row' }}>
<View style={{ width: '90%' }}>
< Image
source={{ uri: this.state.uri }}
style={{ width: 100, height: 100, resizeMode: 'contain' }}
/>
</View>
<View>
<TouchableOpacity onPress={() => this.handlecomClose()} ><Icon color={'#fff'} size={25} style={{ marginLeft: 10, marginTop: 5 }} name="times-circle-o" /></TouchableOpacity>
</View>
</View>}
<View style={this.state.handleHover === true ? styles.footer1 : styles.footer}>
{this.state.handleHover === true ?
// alert(JSON.stringify(this.state.commentDetails))
< View >
<View style={styles.itemBottom}>
<View style={{ width: "90%" }}>
<Text style={{ fontSize: 12, color: 'green' }}>{this.state.commentDetails.username}</Text>
<Text style={{ fontSize: 12, color: 'black' }}>{this.state.commentDetails.message}</Text>
</View>
<TouchableOpacity onPress={() => this.handlecomClose()} ><Icon color={'#000'} size={25} style={{ marginLeft: 10, marginTop: 5 }} name="times-circle-o" /></TouchableOpacity>
</View>
<View style={{ flexDirection: 'row' }}>
<View style={styles.inputContainer}>
<TextInput style={styles.inputs}
autoFocus={true}
placeholder="Message"
underlineColorAndroid='transparent'
multiline={true}
onChangeText={(value) => this.setState({ message: value })}
value={this.state.message} />
<TouchableOpacity style={{ top: -5, right: 15 }} onPress={this.attach}>
<Image source={require('../Images/paperclip.png')} style={styles.iconSendfile} />
</TouchableOpacity>
</View>
{this.state.SendImg === false ?
<TouchableOpacity style={styles.btnSend} disabled={this.state.itemPressedDisabled} onPress={() => { this.sendMessageText() }}>
<Image source={require('../Images/sent.png')} style={styles.iconSend} />
</TouchableOpacity>
:
<TouchableOpacity style={styles.btnSend} disabled={this.state.itemPressedDisabled} onPress={() => { this.attach1() }}>
<Image source={require('../Images/sent.png')} style={styles.iconSend} />
</TouchableOpacity>
}
</ScrollView>
)
}} />
</ScrollView>
{this.state.uri && <View style={{ width: "100%", height: 100, backgroundColor: 'grey', flexDirection: 'row' }}>
<View style={{ width: '90%' }}>
< Image
source={{ uri: this.state.uri }}
style={{ width: 100, height: 100, resizeMode: 'contain' }}
/>
</View>
<View>
<TouchableOpacity onPress={() => this.handlecomClose()} ><Icon color={'#fff'} size={25} style={{ marginLeft: 10, marginTop: 5 }} name="times-circle-o" /></TouchableOpacity>
</View>
</View>}
<View style={this.state.handleHover === true ? styles.footer1 : styles.footer}>
{this.state.handleHover === true ?
// alert(JSON.stringify(this.state.commentDetails))
< View >
<View style={styles.itemBottom}>
<View style={{ width: "90%" }}>
<Text style={{ fontSize: 12, color: 'green' }}>{this.state.commentDetails.username}</Text>
<Text style={{ fontSize: 12, color: 'black' }}>{this.state.commentDetails.message}</Text>
</View>
<TouchableOpacity onPress={() => this.handlecomClose()} ><Icon color={'#000'} size={25} style={{ marginLeft: 10, marginTop: 5 }} name="times-circle-o" /></TouchableOpacity>
</View>
</View> :
<View style={{ flexDirection: 'row' }}>
<View style={styles.inputContainer}>
<TextInput style={styles.inputs}
autoFocus={true}
// autoFocus={true}
placeholder="Message"
underlineColorAndroid='transparent'
multiline={true}
......@@ -925,40 +984,12 @@ export default class GroupChat extends Component {
</View>
</View> :
<View style={{ flexDirection: 'row' }}>
<View style={styles.inputContainer}>
<TextInput style={styles.inputs}
// autoFocus={true}
placeholder="Message"
underlineColorAndroid='transparent'
multiline={true}
onChangeText={(value) => this.setState({ message: value })}
value={this.state.message} />
<TouchableOpacity style={{ top: -5, right: 15 }} onPress={this.attach}>
<Image source={require('../Images/paperclip.png')} style={styles.iconSendfile} />
</TouchableOpacity>
</View>
{this.state.SendImg === false ?
<TouchableOpacity style={styles.btnSend} disabled={this.state.itemPressedDisabled} onPress={() => { this.sendMessageText() }}>
<Image source={require('../Images/sent.png')} style={styles.iconSend} />
</TouchableOpacity>
:
<TouchableOpacity style={styles.btnSend} disabled={this.state.itemPressedDisabled} onPress={() => { this.attach1() }}>
<Image source={require('../Images/sent.png')} style={styles.iconSend} />
</TouchableOpacity>
}
</View>
}
}
</View>
</View>
</View>
</View>}
{/* </View> */}
{/* </KeyboardAvoidingView> */}
</Container>
......
src/CommonComponents/TaskChat.js
View file @ 59d76d92
......@@ -33,6 +33,7 @@ import log from '../LogFile/Log';
import { EMPLOYEEID } from './Header';
import moment from "moment";
import { launchCamera, launchImageLibrary } from 'react-native-image-picker';
import ImageZoom from 'react-native-image-pan-zoom';
const options = {
title: 'Select Image',
......@@ -62,6 +63,7 @@ export default class TaskChat extends Component {
handleHover: false,
commentDetails: {},
SendImg: false,
open: false
};
}
......@@ -72,6 +74,20 @@ export default class TaskChat extends Component {
this.updateMessages();//Update the chat count
this.groupMembersEmail();//Getting the List of GroupMembers Emails
}
openModal = (item) => {
// alert(JSON.stringify(item))
this.setState({
open: true,
image: item
})
}
imageClose = () => {
this.setState({
open: false,
})
}
//getting task related group members added by naveen
groupMembersList() {
log("Info", " groupMembersList(role, userToken, cropcode) is used getting task related group members");
......@@ -801,6 +817,19 @@ export default class TaskChat extends Component {
</Header>
{/* <KeyboardAvoidingView> */}
{this.state.open === true ?
<View style={{ flex: 1, alignItems: "center", height: '100%', width: '100%', justifyContent: 'center' }}>
<ImageZoom
cropWidth={Dimensions.get('window').width}
cropHeight={600}
imageWidth={600}
imageHeight={600}>
<Image source={{ uri: this.state.image.path }} resizeMode='contain' style={{ width: "90%", height: "80%", }} />
</ImageZoom>
<TouchableOpacity onPress={() => this.imageClose()} ><Text>Close</Text></TouchableOpacity>
</View> :
<View style={styles.container}>
<ScrollView
horizontal={true}
......@@ -830,7 +859,7 @@ export default class TaskChat extends Component {
<View style={[styles.itemReply, itemStyleReply]}>
<View style={{ padding: 5, }}>
{itemStyle === styles.itemOut ? <View style={{ flexDirection: 'row' }}><Text style={{ fontSize: 12, color: 'orange' }}>{item.reply_username}</Text></View> : <View style={{ flexDirection: 'row' }}><Text style={{ fontSize: 12, color: 'blue' }}>{item.username}</Text></View>}
{item.reply_path !== "" ? <Image source={{ uri: item.reply_path }} style={{ width: 210, height: 50 }} /> : null}
{item.reply_path !== "" ? <TouchableOpacity onPress={() => this.openModal(item)} ><Image source={{ uri: item.reply_path }} style={{ width: 210, height: 50 }} /></TouchableOpacity> : null}
<Text style={{ width: 210 }} selectable={true} key={Math.random()}>{item.reply_message}</Text>
{!inMessage && this.renderDate(moment(item.messagedTime).format('MM.DD.YYYY hh:mm:ss'))}
{inMessage && this.renderDate(moment(item.messagedTime).format('MM.DD.YYYY hh:mm:ss'))}
......@@ -840,7 +869,7 @@ export default class TaskChat extends Component {
<View style={[styles.item, itemStyle]}>
<View style={{ padding: 5, }}>
{itemStyle === styles.itemOut ? <View style={{ flexDirection: 'row' }}><Text style={{ fontSize: 12, color: 'orange' }}>{item.username}</Text><TouchableOpacity onPress={() => this.handlecom(item)} ><Icon color={'#C0C0C0'} size={25} style={{ marginLeft: 10 }} name="reply" /></TouchableOpacity></View> : <View style={{ flexDirection: 'row' }}><Text style={{ fontSize: 12, color: 'blue' }}>{item.username}</Text><TouchableOpacity onPress={() => this.handlecom(item)} ><Icon color={'#C0C0C0'} size={25} style={{ marginLeft: 10 }} name="reply" /></TouchableOpacity></View>}
{item.path !== "" ? <Image source={{ uri: item.path }} style={styles.imageview} /> : null}
{item.path !== "" ? <TouchableOpacity onPress={() => this.openModal(item)} ><Image source={{ uri: item.path }} style={styles.imageview} /></TouchableOpacity> : null}
<Text style={{ width: 210 }} selectable={true} key={Math.random()}>{item.message}</Text>
{!inMessage && this.renderDate(moment(item.messagedTime).format('MM.DD.YYYY hh:mm:ss'))}
{inMessage && this.renderDate(moment(item.messagedTime).format('MM.DD.YYYY hh:mm:ss'))}
......@@ -852,7 +881,7 @@ export default class TaskChat extends Component {
<View style={[styles.itemSingle, itemStyleSingle]}>
<View style={{ padding: 5, }}>
{itemStyle === styles.itemOut ? <View style={{ flexDirection: 'row' }}><Text style={{ fontSize: 12, color: 'orange' }}>{item.username}</Text><TouchableOpacity onPress={() => this.handlecom(item)} ><Icon color={'#C0C0C0'} size={25} style={{ marginLeft: 10 }} name="reply" /></TouchableOpacity></View> : <View style={{ flexDirection: 'row' }}><Text style={{ fontSize: 12, color: 'blue' }}>{item.username}</Text><TouchableOpacity onPress={() => this.handlecom(item)} ><Icon color={'#C0C0C0'} size={25} style={{ marginLeft: 10 }} name="reply" /></TouchableOpacity></View>}
{item.path !== "" ? <Image source={{ uri: item.path }} style={styles.imageview} /> : null}
{item.path !== "" ? <TouchableOpacity onPress={() => this.openModal(item)} ><Image source={{ uri: item.path }} style={styles.imageview} /></TouchableOpacity> : null}
<Text style={{ width: 210 }} selectable={true} key={Math.random()}>{item.message}</Text>
{!inMessage && this.renderDate(moment(item.messagedTime).format('MM.DD.YYYY hh:mm:ss'))}
{inMessage && this.renderDate(moment(item.messagedTime).format('MM.DD.YYYY hh:mm:ss'))}
......@@ -942,7 +971,7 @@ export default class TaskChat extends Component {
</View>
</View>
</View>}
{/* </KeyboardAvoidingView> */}
</Container>
......
src/CommonComponents/UserChat.js
View file @ 59d76d92
......@@ -31,6 +31,7 @@ import NetInfo from '@react-native-community/netinfo';
import { API, CHATAPI } from "../WebServices/RestClient";
import log from '../LogFile/Log';
import { launchCamera, launchImageLibrary } from 'react-native-image-picker';
import ImageZoom from 'react-native-image-pan-zoom';
const options = {
title: 'Select Image',
......@@ -64,6 +65,7 @@ export default class UserChat extends Component {
handleHover: false,
commentDetails: {},
SendImg: false,
open: false
};
}
......@@ -76,6 +78,21 @@ export default class UserChat extends Component {
// alert(this.props.navigation.state.params.device_id)
}
openModal = (item) => {
// alert(JSON.stringify(item))
this.setState({
open: true,
image: item
})
}
imageClose = () => {
this.setState({
open: false,
})
}
//getting task related messages
getMessages() {
log("Info", " getMessages(role, userToken, cropcode) is used getting task related messages");
......@@ -395,6 +412,19 @@ export default class UserChat extends Component {
</Header>
{/* <KeyboardAvoidingView> */}
{this.state.open === true ?
<View style={{ flex: 1, alignItems: "center", height: '100%', width: '100%', justifyContent: 'center' }}>
<ImageZoom
cropWidth={Dimensions.get('window').width}
cropHeight={600}
imageWidth={600}
imageHeight={600}>
<Image source={{ uri: this.state.image.path }} resizeMode='contain' style={{ width: "90%", height: "80%", }} />
</ImageZoom>
<TouchableOpacity onPress={() => this.imageClose()} ><Text>Close</Text></TouchableOpacity>
</View> :
<View style={styles.container}>
<ScrollView
horizontal={true}
......@@ -425,7 +455,7 @@ export default class UserChat extends Component {
<View style={[styles.itemReply, itemStyleReply]}>
<View style={{ padding: 5, }}>
{itemStyle === styles.itemOut ? <View style={{ flexDirection: 'row' }}><Text style={{ fontSize: 12, color: 'orange' }}>{item.reply_username}</Text></View> : <View style={{ flexDirection: 'row' }}><Text style={{ fontSize: 12, color: 'blue' }}>{item.username}</Text></View>}
{item.reply_path !== "" ? <Image source={{ uri: item.reply_path }} style={{ width: 210, height: 50 }} /> : null}
{item.reply_path !== "" ? <TouchableOpacity onPress={() => this.openModal(item)} ><Image source={{ uri: item.reply_path }} style={{ width: 210, height: 50 }} /></TouchableOpacity> : null}
<Text style={{ width: 210 }} selectable={true} key={Math.random()}>{item.reply_message}</Text>
{!inMessage && this.renderDate(moment(item.messagedTime).format('MM.DD.YYYY hh:mm:ss'))}
{inMessage && this.renderDate(moment(item.messagedTime).format('MM.DD.YYYY hh:mm:ss'))}
......@@ -434,7 +464,7 @@ export default class UserChat extends Component {
<View style={[styles.item, itemStyle]}>
<View style={{ padding: 5, }}>
{itemStyle === styles.itemOut ? <View style={{ flexDirection: 'row' }}><Text style={{ fontSize: 12, color: 'orange' }}>{item.username}</Text><TouchableOpacity onPress={() => this.handlecom(item)} ><Icon color={'#C0C0C0'} size={25} style={{ marginLeft: 10 }} name="reply" /></TouchableOpacity></View> : <View style={{ flexDirection: 'row' }}><Text style={{ fontSize: 12, color: 'blue' }}>{item.username}</Text><TouchableOpacity onPress={() => this.handlecom(item)} ><Icon color={'#C0C0C0'} size={25} style={{ marginLeft: 10 }} name="reply" /></TouchableOpacity></View>}
{item.path !== "" ? <Image source={{ uri: item.path }} style={styles.imageview} /> : null}
{item.path !== "" ? <TouchableOpacity onPress={() => this.openModal(item)} ><Image source={{ uri: item.path }} style={styles.imageview} /></TouchableOpacity> : null}
<Text style={{ width: 210 }} selectable={true} key={Math.random()}>{item.message}</Text>
{!inMessage && this.renderDate(moment(item.messagedTime).format('MM.DD.YYYY hh:mm:ss'))}
{inMessage && this.renderDate(moment(item.messagedTime).format('MM.DD.YYYY hh:mm:ss'))}
......@@ -445,7 +475,7 @@ export default class UserChat extends Component {
<View style={[styles.itemSingle, itemStyleSingle]}>
<View style={{ padding: 5, }}>
{itemStyle === styles.itemOut ? <View style={{ flexDirection: 'row' }}><Text style={{ fontSize: 12, color: 'orange' }}>{item.username}</Text><TouchableOpacity onPress={() => this.handlecom(item)} ><Icon color={'#C0C0C0'} size={25} style={{ marginLeft: 10 }} name="reply" /></TouchableOpacity></View> : <View style={{ flexDirection: 'row' }}><Text style={{ fontSize: 12, color: 'blue' }}>{item.username}</Text><TouchableOpacity onPress={() => this.handlecom(item)} ><Icon color={'#C0C0C0'} size={25} style={{ marginLeft: 10 }} name="reply" /></TouchableOpacity></View>}
{item.path !== "" ? <Image source={{ uri: item.path }} style={styles.imageview} /> : null}
{item.path !== "" ? <TouchableOpacity onPress={() => this.openModal(item)} ><Image source={{ uri: item.path }} style={styles.imageview} /></TouchableOpacity> : null}
<Text style={{ width: 210 }} selectable={true} key={Math.random()}>{item.message}</Text>
{!inMessage && this.renderDate(moment(item.messagedTime).format('MM.DD.YYYY hh:mm:ss'))}
{inMessage && this.renderDate(moment(item.messagedTime).format('MM.DD.YYYY hh:mm:ss'))}
......@@ -543,7 +573,7 @@ export default class UserChat extends Component {
</View>
</View>
</View>}
{/* </KeyboardAvoidingView> */}
</Container>
......
src/Navigation/NavigationRouter.js
View file @ 59d76d92
......@@ -1022,6 +1022,7 @@ const userAppStack = createStackNavigator({
header: null,
},
},
AssignTodo:{
screen:AssignTodo,
navigationOptions:{
......
src/UserComponents/UserProfileKudos.js
View file @ 59d76d92
......@@ -104,7 +104,7 @@ class ListItem extends React.Component {
<View style={styles.box1}>
<View style={{ flexDirection: 'row', width: wp('70%'), marginRight: 20 }}>
<View style={{ flexDirection: 'row', width: wp('60%'), marginRight: 20 }}>
<Text style={styles.signUpText00} >Kudos Description:</Text>
<Text style={styles.signUpText11} >{item.description}</Text>
</View>
......@@ -617,7 +617,7 @@ export default class UserProfileKudos extends Component {
<Icon style={{ marginRight: 10 }} name="search" size={20} /> */}
</Item>
<View style={{ height: '67%' }}>
<View style={{ height: '88%' }}>
<FlatList
// data={this.props.data}
......
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment