Commit 93050ee4 authored by santhosh's avatar santhosh
Browse files

chat

parent abb2f436
Showing with 349 additions and 135 deletions
+349 -135
...@@ -28,7 +28,7 @@ import AsyncStorage from '@react-native-community/async-storage'; ...@@ -28,7 +28,7 @@ import AsyncStorage from '@react-native-community/async-storage';
import { Title, Container, Content, Header, Right, Left, Body, Tab, Tabs, TabHeading, Footer, Item, Input, FooterTab, Subtitle } from 'native-base'; import { Title, Container, Content, Header, Right, Left, Body, Tab, Tabs, TabHeading, Footer, Item, Input, FooterTab, Subtitle } from 'native-base';
import moment from "moment"; import moment from "moment";
import NetInfo from '@react-native-community/netinfo'; import NetInfo from '@react-native-community/netinfo';
import { API,CHATAPI } from "../WebServices/RestClient"; import { API, CHATAPI } from "../WebServices/RestClient";
import log from '../LogFile/Log'; import log from '../LogFile/Log';
import { launchCamera, launchImageLibrary } from 'react-native-image-picker'; import { launchCamera, launchImageLibrary } from 'react-native-image-picker';
...@@ -62,6 +62,9 @@ export default class AdminChatUser extends Component { ...@@ -62,6 +62,9 @@ export default class AdminChatUser extends Component {
groupList: '', groupList: '',
handleHover: false, handleHover: false,
commentDetails: {}, commentDetails: {},
SendImg : false,
cls:'1',
}; };
// alert("Msgcount"+this.props.navigation.state.params.sno) // alert("Msgcount"+this.props.navigation.state.params.sno)
} }
...@@ -319,7 +322,8 @@ export default class AdminChatUser extends Component { ...@@ -319,7 +322,8 @@ export default class AdminChatUser extends Component {
this.getMessages(); this.getMessages();
this.setState({ this.setState({
message: '', message: '',
handleHover: false handleHover: false,
// commentDetails:null
}); });
...@@ -332,10 +336,16 @@ export default class AdminChatUser extends Component { ...@@ -332,10 +336,16 @@ export default class AdminChatUser extends Component {
// }); // });
} }
openGallery = async () => { openGallery1 (){
// alert("clicked") const images = this.state.images1;
const images = await launchImageLibrary(options); // // alert(JSON.stringify(images))
// alert(JSON.stringify(images)) // this.setState({
// images1: images,
// uri: images.assets[0].uri,
// SendImg : true
// })
// alert("images" + JSON.stringify(this.state.images1))
const message = this.state.message; const message = this.state.message;
AsyncStorage.multiGet(["cropcode", "userToken"], async (err, response) => { AsyncStorage.multiGet(["cropcode", "userToken"], async (err, response) => {
const cropcode = response[0][1]; const cropcode = response[0][1];
...@@ -371,11 +381,32 @@ export default class AdminChatUser extends Component { ...@@ -371,11 +381,32 @@ export default class AdminChatUser extends Component {
); );
let responseJson = await res1.json(); let responseJson = await res1.json();
this.getMessages(); this.getMessages();
this.setState({
handleHover: false,
uri: null,
SendImg : false,
message: '',
// commentDetails:null
})
alert("Image Uploaded successfully") alert("Image Uploaded successfully")
}); });
}); });
} }
openGallery = async () => {
// alert("clicked")
const images1 = await launchImageLibrary(options);
// alert(JSON.stringify(images))
this.setState({
images1: images,
uri: images.assets[0].uri,
SendImg : true
})
// alert("images" + JSON.stringify(this.state.images1))
}
renderDate = (date) => { renderDate = (date) => {
return ( return (
<Text style={styles.time}> <Text style={styles.time}>
...@@ -395,6 +426,10 @@ export default class AdminChatUser extends Component { ...@@ -395,6 +426,10 @@ export default class AdminChatUser extends Component {
this.setState({ this.setState({
handleHover: false, handleHover: false,
uri: null,
SendImg : false,
reply_id:''
}) })
} }
...@@ -423,12 +458,12 @@ export default class AdminChatUser extends Component { ...@@ -423,12 +458,12 @@ export default class AdminChatUser extends Component {
onPress={() => onPress={() =>
this.props.navigation.goBack()} /> this.props.navigation.goBack()} />
<Body style={styles.hstyles}> <Body style={styles.hstyles}>
<Title style={{ color: '#fff', fontSize: 14, paddingLeft: 10, flexDirection: 'row' }}> <Title style={{ color: '#fff', fontSize: 14, paddingLeft: 10, flexDirection: 'row' }}>
<View style={styles.btnSend} > <View style={styles.btnSend} >
<Text style={styles.iconSendtop} >{(this.props.navigation.state.params.name).substring(0, 2).toUpperCase()}</Text> <Text style={styles.iconSendtop} >{(this.props.navigation.state.params.name).substring(0, 2).toUpperCase()}</Text>
</View> </View>
<View style={{top:-10}}> <View style={{ top: -10 }}>
<Text style={{color:'white',fontWeight:'bold', paddingLeft:10,top:-10}}> <Text style={{ color: 'white', fontWeight: 'bold', paddingLeft: 10, top: -10 }}>
{this.props.navigation.state.params.name} {this.props.navigation.state.params.name}
</Text> </Text>
</View> </View>
...@@ -499,7 +534,16 @@ export default class AdminChatUser extends Component { ...@@ -499,7 +534,16 @@ export default class AdminChatUser extends Component {
) )
}} /> }} />
</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}> <View style={this.state.handleHover === true ? styles.footer1 : styles.footer}>
...@@ -510,11 +554,13 @@ export default class AdminChatUser extends Component { ...@@ -510,11 +554,13 @@ export default class AdminChatUser extends Component {
<Text style={{ fontSize: 12, color: 'green' }}>{this.state.commentDetails.username}</Text> <Text style={{ fontSize: 12, color: 'green' }}>{this.state.commentDetails.username}</Text>
<Text style={{ fontSize: 12, color: 'black' }}>{this.state.commentDetails.message}</Text> <Text style={{ fontSize: 12, color: 'black' }}>{this.state.commentDetails.message}</Text>
</View> </View>
<TouchableOpacity onPress={() => this.handlecomClose()} ><Icon color={'#000'} size={25} style={{ marginLeft: 10, marginTop: 5 }} name="times-circle-o" /></TouchableOpacity> <TouchableOpacity onPress={() => this.handlecomClose(this.state.commentDetails)} ><Icon color={'#000'} size={25} style={{ marginLeft: 10, marginTop: 5 }} name="times-circle-o" /></TouchableOpacity>
</View> </View>
} }
<View style={{ flexDirection: 'row' }}> <View style={{ flexDirection: 'row' }}>
<View style={styles.inputContainer}> <View style={styles.inputContainer}>
<TextInput style={styles.inputs} <TextInput style={styles.inputs}
placeholder="Message" placeholder="Message"
...@@ -527,9 +573,15 @@ export default class AdminChatUser extends Component { ...@@ -527,9 +573,15 @@ export default class AdminChatUser extends Component {
<Image source={require('../Images/paperclip.png')} style={styles.iconSendfile} /> <Image source={require('../Images/paperclip.png')} style={styles.iconSendfile} />
</TouchableOpacity> </TouchableOpacity>
</View> </View>
<TouchableOpacity style={styles.btnSend} disabled={this.state.itemPressedDisabled} onPress={() => { this.sendMessageText() }}> {this.state.SendImg === false ?
<Image source={require('../Images/sent.png')} style={styles.iconSend} /> <TouchableOpacity style={styles.btnSend} disabled={this.state.itemPressedDisabled} onPress={() => { this.sendMessageText() }}>
</TouchableOpacity> <Image source={require('../Images/sent.png')} style={styles.iconSend} />
</TouchableOpacity>
:
<TouchableOpacity style={styles.btnSend} disabled={this.state.itemPressedDisabled} onPress={() => {this.openGallery1()}}>
<Image source={require('../Images/sent.png')} style={styles.iconSend} />
</TouchableOpacity>
}
</View> </View>
...@@ -580,6 +632,15 @@ const styles = StyleSheet.create({ ...@@ -580,6 +632,15 @@ const styles = StyleSheet.create({
alignItems: 'center', alignItems: 'center',
justifyContent: 'center', justifyContent: 'center',
}, },
btnSendImg: {
backgroundColor: "green",
width: 40,
margin: 6,
height: 40,
borderRadius: 360,
alignItems: 'center',
justifyContent: 'center',
},
iconSend: { iconSend: {
width: 25, width: 25,
...@@ -591,7 +652,7 @@ const styles = StyleSheet.create({ ...@@ -591,7 +652,7 @@ const styles = StyleSheet.create({
height: 25, height: 25,
alignSelf: 'center', alignSelf: 'center',
color: 'white', color: 'white',
padding:1 padding: 1
}, },
iconSendfile: { iconSendfile: {
width: 25, width: 25,
...@@ -609,7 +670,7 @@ const styles = StyleSheet.create({ ...@@ -609,7 +670,7 @@ const styles = StyleSheet.create({
// alignItems: 'center', // alignItems: 'center',
// flex: 1, // flex: 1,
width: '85%', width: '85%',
marginTop: 5, marginTop: 5,
alignItems: 'baseline', alignItems: 'baseline',
}, },
......
...@@ -40,11 +40,11 @@ const options = { ...@@ -40,11 +40,11 @@ const options = {
title: 'Select Image', title: 'Select Image',
type: 'library', type: 'library',
options: { options: {
maxHeight: 200, maxHeight: 200,
maxWidth: 200, maxWidth: 200,
selectionLimit: 1, selectionLimit: 1,
mediaType: 'photo', mediaType: 'photo',
includeBase64: false includeBase64: false
}, },
} }
export default class GroupChat extends Component { export default class GroupChat extends Component {
...@@ -65,6 +65,7 @@ export default class GroupChat extends Component { ...@@ -65,6 +65,7 @@ export default class GroupChat extends Component {
groupList: '', groupList: '',
handleHover: false, handleHover: false,
commentDetails: {}, commentDetails: {},
SendImg: false,
}; };
} }
...@@ -683,51 +684,71 @@ export default class GroupChat extends Component { ...@@ -683,51 +684,71 @@ export default class GroupChat extends Component {
}); });
}); });
} }
attach1(){
attach = async () => {
// alert("clicked") // alert("clicked")
const images1 = await launchImageLibrary(options); const images1 = this.state.images;
console.log(images1.assets[0]) console.log(images1.assets[0])
const message = this.state.message; const message = this.state.message;
const groupId = this.state.subtaskId; const groupId = this.state.subtaskId;
AsyncStorage.multiGet(["cropcode", "userToken"], async (err, response) => { AsyncStorage.multiGet(["cropcode", "userToken"], async (err, response) => {
const cropcode = response[0][1]; const cropcode = response[0][1];
const userToken = response[1][1]; const userToken = response[1][1];
AsyncStorage.getItem("projectId", async (err, res) => { AsyncStorage.getItem("projectId", async (err, res) => {
const projectId = res; const projectId = res;
const data = new FormData() const data = new FormData()
data.append('file', { data.append('file', {
uri: images1.assets[0].uri, uri: images1.assets[0].uri,
type: images1.assets[0].type, type: images1.assets[0].type,
name: images1.assets[0].fileName, name: images1.assets[0].fileName,
}) })
data.append('message',this.state.message) data.append('message', this.state.message)
data.append('action', 'media') data.append('action', 'media')
data.append('corp_code', cropcode) data.append('corp_code', cropcode)
data.append('groupId', groupId) data.append('groupId', groupId)
data.append('messagedBy', userToken) data.append('messagedBy', userToken)
data.append('api', CHATAPI) data.append('api', CHATAPI)
data.append('groupName',this.state.groupName); data.append('groupName', this.state.groupName);
data.append('groupEmail',this.state.members_email); data.append('groupEmail', this.state.members_email);
data.append('reply_id', this.state.commentDetails.id ? this.state.commentDetails.id : "") data.append('reply_id', this.state.commentDetails.id ? this.state.commentDetails.id : "")
let res1 = await fetch(API + 'group_chat1.php', let res1 = await fetch(API + 'group_chat1.php',
{ {
method: 'post', method: 'post',
body: data, body: data,
headers: { headers: {
'Content-Type': 'multipart/form-data; ', 'Content-Type': 'multipart/form-data; ',
}, },
} }
); );
let responseJson = await res1.json(); let responseJson = await res1.json();
this.getMessages(); this.getMessages();
alert("Image Uploaded successfully") this.setState({
}); handleHover: false,
uri: null,
SendImg: false,
message: '',
// commentDetails:null
})
alert("Image Uploaded successfully")
});
}); });
} }
attach = async () => {
// alert("clicked")
const images = await launchImageLibrary(options);
this.setState({
images: images,
uri: images.assets[0].uri,
SendImg: true
})
// alert("images" + JSON.stringify(this.state.images))
}
renderDate = (date) => { renderDate = (date) => {
return ( return (
...@@ -748,6 +769,9 @@ export default class GroupChat extends Component { ...@@ -748,6 +769,9 @@ export default class GroupChat extends Component {
this.setState({ this.setState({
handleHover: false, handleHover: false,
uri: null,
SendImg: false,
reply_id: ''
}) })
} }
...@@ -848,6 +872,17 @@ export default class GroupChat extends Component { ...@@ -848,6 +872,17 @@ export default class GroupChat extends Component {
}} /> }} />
</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}> <View style={this.state.handleHover === true ? styles.footer1 : styles.footer}>
{this.state.handleHover && {this.state.handleHover &&
...@@ -870,13 +905,19 @@ export default class GroupChat extends Component { ...@@ -870,13 +905,19 @@ export default class GroupChat extends Component {
onChangeText={(value) => this.setState({ message: value })} onChangeText={(value) => this.setState({ message: value })}
value={this.state.message} /> value={this.state.message} />
<TouchableOpacity style={{ top: -5, right: 15 }} onPress={this.attach}> <TouchableOpacity style={{ top: -5, right: 15 }} onPress={this.attach}>
<Image source={require('../Images/paperclip.png')} style={styles.iconSendfile} /> <Image source={require('../Images/paperclip.png')} style={styles.iconSendfile} />
</TouchableOpacity> </TouchableOpacity>
</View> </View>
<TouchableOpacity style={styles.btnSend} disabled={this.state.itemPressedDisabled} onPress={() => { this.sendMessageText() }}> {this.state.SendImg === false ?
<Image source={require('../Images/sent.png')} style={styles.iconSend} /> <TouchableOpacity style={styles.btnSend} disabled={this.state.itemPressedDisabled} onPress={() => { this.sendMessageText() }}>
</TouchableOpacity> <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>
...@@ -928,6 +969,16 @@ const styles = StyleSheet.create({ ...@@ -928,6 +969,16 @@ const styles = StyleSheet.create({
justifyContent: 'center', justifyContent: 'center',
}, },
btnSendImg: {
backgroundColor: "green",
width: 40,
margin: 6,
height: 40,
borderRadius: 360,
alignItems: 'center',
justifyContent: 'center',
},
iconSend: { iconSend: {
width: 25, width: 25,
height: 25, height: 25,
......
...@@ -38,11 +38,11 @@ const options = { ...@@ -38,11 +38,11 @@ const options = {
title: 'Select Image', title: 'Select Image',
type: 'library', type: 'library',
options: { options: {
maxHeight: 200, maxHeight: 200,
maxWidth: 200, maxWidth: 200,
selectionLimit: 1, selectionLimit: 1,
mediaType: 'photo', mediaType: 'photo',
includeBase64: false includeBase64: false
}, },
} }
export default class TaskChat extends Component { export default class TaskChat extends Component {
...@@ -61,6 +61,7 @@ export default class TaskChat extends Component { ...@@ -61,6 +61,7 @@ export default class TaskChat extends Component {
groupList: '', groupList: '',
handleHover: false, handleHover: false,
commentDetails: {}, commentDetails: {},
SendImg: false,
}; };
} }
...@@ -676,52 +677,72 @@ export default class TaskChat extends Component { ...@@ -676,52 +677,72 @@ export default class TaskChat extends Component {
}); });
}); });
} }
attach = async () => { attach1(){
// alert("clicked") // alert("clicked")
const images1 = await launchImageLibrary(options); const images1 = this.state.images;
console.log(images1.assets[0]) console.log(images1.assets[0])
const message = this.state.message; const message = this.state.message;
const groupId = this.state.subtaskId; const groupId = this.state.subtaskId;
AsyncStorage.multiGet(["cropcode", "userToken"], async (err, response) => { AsyncStorage.multiGet(["cropcode", "userToken"], async (err, response) => {
const cropcode = response[0][1]; const cropcode = response[0][1];
const userToken = response[1][1]; const userToken = response[1][1];
AsyncStorage.getItem("projectId", async (err, res) => { AsyncStorage.getItem("projectId", async (err, res) => {
const projectId = res; const projectId = res;
const data = new FormData() const data = new FormData()
data.append('file', { data.append('file', {
uri: images1.assets[0].uri, uri: images1.assets[0].uri,
type: images1.assets[0].type, type: images1.assets[0].type,
name: images1.assets[0].fileName, name: images1.assets[0].fileName,
}) })
data.append('message',this.state.message) data.append('message', this.state.message)
data.append('action', 'media') data.append('action', 'media')
data.append('corp_code', cropcode) data.append('corp_code', cropcode)
data.append('groupId', groupId) data.append('groupId', groupId)
data.append('messagedBy', userToken) data.append('messagedBy', userToken)
data.append('api', CHATAPI) data.append('api', CHATAPI)
data.append('groupName',this.state.groupName); data.append('groupName', this.state.groupName);
data.append('groupEmail',this.state.members_email); data.append('groupEmail', this.state.members_email);
data.append('reply_id', this.state.commentDetails.id ? this.state.commentDetails.id : "") data.append('reply_id', this.state.commentDetails.id ? this.state.commentDetails.id : "")
let res1 = await fetch(API+'user_story_chat1.php', let res1 = await fetch(API + 'user_story_chat1.php',
{ {
method: 'post', method: 'post',
body: data, body: data,
headers: { headers: {
'Content-Type': 'multipart/form-data; ', 'Content-Type': 'multipart/form-data; ',
}, },
} }
); );
let responseJson = await res1.json(); let responseJson = await res1.json();
this.getMessages(); this.getMessages();
alert("Image Uploaded successfully") this.setState({
}); handleHover: false,
uri: null,
SendImg: false,
message: '',
// commentDetails:null
})
alert("Image Uploaded successfully")
});
}); });
} }
attach = async () => {
// alert("clicked")
const images = await launchImageLibrary(options);
this.setState({
images: images,
uri: images.assets[0].uri,
SendImg: true
})
// alert("images" + JSON.stringify(this.state.images))
}
renderDate = (date) => { renderDate = (date) => {
...@@ -743,6 +764,9 @@ export default class TaskChat extends Component { ...@@ -743,6 +764,9 @@ export default class TaskChat extends Component {
this.setState({ this.setState({
handleHover: false, handleHover: false,
uri: null,
SendImg: false,
message: '',
}) })
} }
...@@ -804,7 +828,7 @@ export default class TaskChat extends Component { ...@@ -804,7 +828,7 @@ export default class TaskChat extends Component {
<View style={[styles.itemReply, itemStyleReply]}> <View style={[styles.itemReply, itemStyleReply]}>
<View style={{ padding: 5, }}> <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>} {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 !== "" ? <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> <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'))}
{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'))}
...@@ -814,7 +838,7 @@ export default class TaskChat extends Component { ...@@ -814,7 +838,7 @@ export default class TaskChat extends Component {
<View style={[styles.item, itemStyle]}> <View style={[styles.item, itemStyle]}>
<View style={{ padding: 5, }}> <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>} {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 !== "" ? <Image source={{ uri: item.path }} style={styles.imageview} /> : null}
<Text style={{ width: 210 }} selectable={true} key={Math.random()}>{item.message}</Text> <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'))}
{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'))}
...@@ -839,6 +863,17 @@ export default class TaskChat extends Component { ...@@ -839,6 +863,17 @@ export default class TaskChat extends Component {
}} /> }} />
</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}> <View style={this.state.handleHover === true ? styles.footer1 : styles.footer}>
{this.state.handleHover && {this.state.handleHover &&
...@@ -861,13 +896,19 @@ export default class TaskChat extends Component { ...@@ -861,13 +896,19 @@ export default class TaskChat extends Component {
onChangeText={(value) => this.setState({ message: value })} onChangeText={(value) => this.setState({ message: value })}
value={this.state.message} /> value={this.state.message} />
<TouchableOpacity style={{ top: -5, right: 15 }} onPress={this.attach}> <TouchableOpacity style={{ top: -5, right: 15 }} onPress={this.attach}>
<Image source={require('../Images/paperclip.png')} style={styles.iconSendfile} /> <Image source={require('../Images/paperclip.png')} style={styles.iconSendfile} />
</TouchableOpacity> </TouchableOpacity>
</View> </View>
<TouchableOpacity style={styles.btnSend} disabled={this.state.itemPressedDisabled} onPress={() => { this.sendMessageText() }}> {this.state.SendImg === false ?
<Image source={require('../Images/sent.png')} style={styles.iconSend} /> <TouchableOpacity style={styles.btnSend} disabled={this.state.itemPressedDisabled} onPress={() => { this.sendMessageText() }}>
</TouchableOpacity> <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>
...@@ -915,6 +956,16 @@ const styles = StyleSheet.create({ ...@@ -915,6 +956,16 @@ const styles = StyleSheet.create({
justifyContent: 'center', justifyContent: 'center',
}, },
btnSendImg: {
backgroundColor: "green",
width: 40,
margin: 6,
height: 40,
borderRadius: 360,
alignItems: 'center',
justifyContent: 'center',
},
iconSend: { iconSend: {
width: 25, width: 25,
height: 25, height: 25,
......
...@@ -42,7 +42,7 @@ const options = { ...@@ -42,7 +42,7 @@ const options = {
mediaType: 'photo', mediaType: 'photo',
includeBase64: false includeBase64: false
}, },
} }
export default class UserChat extends Component { export default class UserChat extends Component {
...@@ -62,6 +62,7 @@ export default class UserChat extends Component { ...@@ -62,6 +62,7 @@ export default class UserChat extends Component {
groupList: '', groupList: '',
handleHover: false, handleHover: false,
commentDetails: {}, commentDetails: {},
SendImg: false,
}; };
} }
...@@ -273,10 +274,10 @@ export default class UserChat extends Component { ...@@ -273,10 +274,10 @@ export default class UserChat extends Component {
}); });
}); });
} }
attach = async () => { attach1() {
// alert("clicked") // alert("clicked")
const images1 = await launchImageLibrary(options); const images1 = this.state.images;
console.log(images1.assets[0])
const message = this.state.message; const message = this.state.message;
const groupId = this.state.subtaskId; const groupId = this.state.subtaskId;
AsyncStorage.multiGet(["cropcode", "userToken"], async (err, response) => { AsyncStorage.multiGet(["cropcode", "userToken"], async (err, response) => {
...@@ -290,19 +291,19 @@ export default class UserChat extends Component { ...@@ -290,19 +291,19 @@ export default class UserChat extends Component {
type: images1.assets[0].type, type: images1.assets[0].type,
name: images1.assets[0].fileName, name: images1.assets[0].fileName,
}) })
data.append('message',this.state.message) data.append('message', this.state.message)
data.append('action', 'media') data.append('action', 'media')
data.append('corp_code', cropcode) data.append('corp_code', cropcode)
data.append('projectId', projectId) data.append('projectId', projectId)
data.append('messagedBy', userToken) data.append('messagedBy', userToken)
data.append('api', CHATAPI) data.append('api', CHATAPI)
data.append('sendBy',userToken); data.append('sendBy', userToken);
data.append('receivedBy',this.props.navigation.state.params.empId); data.append('receivedBy', this.props.navigation.state.params.empId);
data.append('reply_id', this.state.commentDetails.id ? this.state.commentDetails.id : "") data.append('reply_id', this.state.commentDetails.id ? this.state.commentDetails.id : "")
let res1 = await fetch(API+'userChat1.php', let res1 = await fetch(API + 'userChat1.php',
{ {
method: 'post', method: 'post',
body: data, body: data,
...@@ -313,9 +314,29 @@ export default class UserChat extends Component { ...@@ -313,9 +314,29 @@ export default class UserChat extends Component {
); );
let responseJson = await res1.json(); let responseJson = await res1.json();
this.getMessages(); this.getMessages();
this.setState({
handleHover: false,
uri: null,
SendImg: false,
message: '',
// commentDetails:null
})
alert("Image Uploaded successfully") alert("Image Uploaded successfully")
}); });
}); });
}
attach = async () => {
// alert("clicked")
const images = await launchImageLibrary(options);
this.setState({
images: images,
uri: images.assets[0].uri,
SendImg: true
})
// alert("images" + JSON.stringify(this.state.images))
} }
renderDate = (date) => { renderDate = (date) => {
return ( return (
...@@ -335,6 +356,9 @@ export default class UserChat extends Component { ...@@ -335,6 +356,9 @@ export default class UserChat extends Component {
this.setState({ this.setState({
handleHover: false, handleHover: false,
uri: null,
SendImg: false,
message: '',
}) })
} }
...@@ -431,6 +455,17 @@ export default class UserChat extends Component { ...@@ -431,6 +455,17 @@ export default class UserChat extends Component {
}} /> }} />
</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>}
...@@ -459,9 +494,15 @@ export default class UserChat extends Component { ...@@ -459,9 +494,15 @@ export default class UserChat extends Component {
<Image source={require('../Images/paperclip.png')} style={styles.iconSendfile} /> <Image source={require('../Images/paperclip.png')} style={styles.iconSendfile} />
</TouchableOpacity> </TouchableOpacity>
</View> </View>
<TouchableOpacity style={styles.btnSend} disabled={this.state.itemPressedDisabled} onPress={() => { this.sendMessageText() }}> {this.state.SendImg === false ?
<Image source={require('../Images/sent.png')} style={styles.iconSend} /> <TouchableOpacity style={styles.btnSend} disabled={this.state.itemPressedDisabled} onPress={() => { this.sendMessageText() }}>
</TouchableOpacity> <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>
...@@ -513,6 +554,16 @@ const styles = StyleSheet.create({ ...@@ -513,6 +554,16 @@ const styles = StyleSheet.create({
justifyContent: 'center', justifyContent: 'center',
}, },
btnSendImg: {
backgroundColor: "green",
width: 40,
margin: 6,
height: 40,
borderRadius: 360,
alignItems: 'center',
justifyContent: 'center',
},
iconSend: { iconSend: {
width: 25, width: 25,
height: 25, height: 25,
......
/*****MySql********/ /*****MySql********/
//pre production environment (development) //pre production environment (development)
export const API = "https://api-single.agile24x7.com/release/"; // export const API = "https://api-single.agile24x7.com/release/";
export const CHATAPI = "https://api-single.agile24x7.com/release"; // export const CHATAPI = "https://api-single.agile24x7.com/release";
export const ReportsAPI = "https://testapiv2reporting.agile24x7.com/"; // export const ReportsAPI = "https://testapiv2reporting.agile24x7.com/";
export const Client_URL = "https://sdtest.agile24x7.com/#/"; // export const Client_URL = "https://sdtest.agile24x7.com/#/";
//production environment //production environment
// export const API = "https://api-single.agile24x7.com/Migration/"; // export const API = "https://api-single.agile24x7.com/Migration/";
...@@ -17,10 +17,10 @@ export const Client_URL = "https://sdtest.agile24x7.com/#/"; ...@@ -17,10 +17,10 @@ export const Client_URL = "https://sdtest.agile24x7.com/#/";
// //pre production environment (development) // //pre production environment (development)
// export const API = "https://api-single.agile24x7.com/pg_migration/"; export const API = "https://api-single.agile24x7.com/pg_migration/";
// export const CHATAPI = "https://api-single.agile24x7.com/pg_migration"; export const CHATAPI = "https://api-single.agile24x7.com/pg_migration";
// export const ReportsAPI = "https://pgtestreporting.agile24x7.com/"; export const ReportsAPI = "https://pgtestreporting.agile24x7.com/";
// export const Client_URL = "https://pgtest.agile24x7.com/#/"; export const Client_URL = "https://pgtest.agile24x7.com/#/";
//production environment //production environment
......
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