Home.js 8.29 KB
import React from "react"
import {
	View,
	StyleSheet,
	Text,
	Image,
	LayoutAnimation,
	TextInput,
	ScrollView,
	Dimensions,
	TouchableOpacity,
	TouchableWithoutFeedback,
	NativeModules,
	FlatList,
	StatusBar,
	Alert,
	Platform,
	PanResponder
} from "react-native";
import {observer} from 'mobx-react/native'
import SearchBar from '../components/SearchBar';
import homeLogic from '../logic/homeLogic'
import {ownerUserId} from "../service/rpc";
import moment from 'moment'
import {AndroidView} from "../components/BackButton";
import {withNavigationFocus} from 'react-navigation-is-focused-hoc'
import BackButton from "../components/BackButton";
import {_listId,_title,_objectType,_taskId} from "../../App";
import TouchView from '../components/TouchView'
import {delList} from "../logic/delLogic";
export const width = Dimensions.get('window').width
export const height = Dimensions.get('window').height
import {isAndroid} from "../components/SearchBar";
import {observable} from 'mobx'
const styles = StyleSheet.create({
	container: {
		flex: 1,
	},
	item: {
		height: 55,
		paddingHorizontal: 17.5,
		flexDirection: 'row',
		alignItems: 'center',
		width,
		backgroundColor:"white",
	},
	itemIcon: {
		width: 21,
		height: 21,
		marginRight: 10,
	},
	itemText: {
		flex: 1,
		fontSize: 18,
		color: '#333333',
	},
	bigButton: {
		height: 60,
		width: 60,
		borderRadius: 30,
		alignItems: 'center',
		justifyContent: 'center',
		overflow: 'hidden',
		position: 'absolute',
		bottom: 32,
		left: width / 2 - 30,
	},
	overFont: {
		fontSize: 18,
		color: "#ee5e53",
		width: 30,
		textAlign: 'right'
	},
	font: {
		fontSize: 18,
		color: "#666666",
		width: 35,
		textAlign: 'right'
	},
	shutIcon:{
		height:16,
		width:16,
	},

})

@observer
class Home extends React.Component {
	static navigationOptions = (navigation) => {
		return {
			headerTitle: '任务中心',
			headerLeft:<BackButton home/>,
			headerRight:<AndroidView/>
		}
	}
	logic = new homeLogic()
	pan=PanResponder.create({
		onStartShouldSetPanResponderCapture:() => true,
		onMoveShouldSetPanResponder:()=>true,
	})
	async componentWillMount() {
		if(!!_taskId.get()){
			this.props.navigation.navigate("TaskDetail", {id:_taskId.get()})
		}else if(!!_listId.get()){
			this.props.navigation.navigate("TaskList", {listId: _listId.get(), title: _title.get(),objectType:_objectType.get()})
			_listId.set(null)
			_title.set(null)
			_objectType.set(null)
		}else{
			await this.getData()
		}
	}
	async componentWillReceiveProps(props) {
		if ( props.isFocused) {
			await this.getData()
		}
	}
	async getData() {
		await Promise.all([
			this.logic.getList(),
			this.logic.getCount()
		])
	}

	toNext(id, name, key,objectType) {
		const {navigation} = this.props
		const date = new Date(new Date().setHours(23, 59, 59, 59)).getTime()
		const data1 = moment(date).format("YYYY-MM-DD HH:mm:ss")
		const date1 = new Date().getDay()
		const date2 = date + (7 - date1) * 86400*1000
		const data2 = moment(date2).format("YYYY-MM-DD HH:mm:ss")
		console.log(data2)
		if (key === 0) {
			navigation.navigate("TaskList", {ownerUserId,isStar: true, title: name, isDone: false,})
			return
		}
		if (key === 1) {
			navigation.navigate("TaskList", {ownerUserId, title: name, isDone: false,myTask:true})
			return
		}
		if (key === 2) {
			navigation.navigate("TaskList", {ownerUserId, title: name, isDone: false, deadlineDate: data1 + ""})
			return
		}
		if (key === 3) {
			navigation.navigate("TaskList", {ownerUserId, title: name, isDone: false, deadlineDate: data2})
			return
		}
		navigation.navigate("TaskList", {listId: id,objectType, title: name, ownerUserId})
	}

	tip(v) {
		if (v === "INCIDENT") {
			return "-事件"
		}
		if (v === "ADVICE") {
			return "-建议"
		}
		if (v === "SUPPORT") {
			return "-支持"
		}
		if (v === "ISSUE") {
			return "-问题"
		}
		if (v === "PLAN_ITEM") {
			return "-事件"
		}
		if (v === "TASK") {
			return "-任务"
		}
		return ""
	}
	async del(id){
		Alert.alert("注意","确认要删除吗?",[
			{text:"取消",onPress:()=>{
				// this[`touchView${this.id}`]&&this[`touchView${this.id}`].moveBack()
			}},
			{text:"确认",onPress:async()=>{
				const data=await delList(id)
					if(data){
						await this.getData()
					}
				}},
		])
	}
	call=(v)=>{
		console.log(v)
		if(this.id&&this.id!==v){
			this[`touchView${this.id}`]&&this[`touchView${this.id}`].moveBack()
		}
		this.id=v
	}
	item = (v) => {
		const {key, id, objectName, objectType, overdueCount, taskCount, taskObjectCategory,
			taskObjectName, taskObjectType, tenantId, color, img, count, overCount,noMove} = v
		const textStyle = color && {color: '#2c8fff'}
		const name = objectName + this.tip(taskObjectCategory || "")
		if(noMove){
			return (
				<TouchableOpacity style={styles.item} onPress={() => {
					this[`touchView${this.id}`]&&this[`touchView${this.id}`].moveBack()
					if(v.onPress){
						v.onPress()
						return
					}
					this.toNext(id, name, key,objectType)
				}}>
					<Image style={styles.itemIcon} source={img || require("./imgs/menu.png")} resizeMode='contain'/>
					<Text style={[styles.itemText, textStyle]} numberOfLines={1} >{name}</Text>
					<Text style={styles.overFont}>{overdueCount || ""}</Text>
					<Text style={styles.font}>{taskCount||""}</Text>
				</TouchableOpacity>
			)
		}
		return (
			<TouchView onPress={async()=>await this.del(id)} ref={z=>this[`touchView${id}${taskObjectCategory}`]=z}  id={id+taskObjectCategory} call={this.call}>
			<TouchableOpacity style={styles.item}  onPress={() => {
				this[`touchView${this.id}`]&&this[`touchView${this.id}`].moveBack()
				if(v.onPress){
					v.onPress()
					return
				}
				this.toNext(id, name, key,objectType)
			}}
			>
				<Image style={styles.itemIcon} source={img || require("./imgs/menu.png")} resizeMode='contain'/>
				<Text style={[styles.itemText, textStyle]} numberOfLines={1}>{name}</Text>
				 <Text style={styles.overFont}>{overdueCount || ""}</Text>
				<Text style={styles.font}>{taskCount||""}</Text>
			</TouchableOpacity>
			</TouchView>
		)
	}
	onPress = () => {
		const {navigation} = this.props
		const data=this.logic.list.map(v=>{return {name:v.objectName + this.tip(v.taskObjectCategory||""),...v}})
		navigation.navigate("Write",{list:data})
	}
	onPress1 = () => {
		const {navigation} = this.props
		navigation.navigate("AddList",{title:"新建清单"})
	}

	render() {
		const data = [
			{
				objectName: "已加星标",
				img: require('./imgs/star.png'),
				taskCount: this.logic.count.star,
				overdueCount: this.logic.count.overStar,
				key: 0,
				id: "_myid1",
				taskObjectCategory: "关你啥事情1",
				noMove:true
			},
			{objectName: "分配给我的",
				img: require('./imgs/mine.png'),
				key: 1,
				id: "_myid2",
				taskCount: this.logic.count.myTaskCount,
				overdueCount: this.logic.count.myOverdueCount,
				taskObjectCategory: "关你啥事情2",
				noMove:true
			},
			{
				objectName: "今天",
				img: require('./imgs/today.png'),
				taskCount: this.logic.count.today,
				overdueCount: this.logic.count.overToday,
				key: 2,
				id: "_myid3",
				taskObjectCategory: "关你啥事情3",
				noMove:true
			},
			{
				objectName: "周",
				img: require('./imgs/week.png'),
				taskCount: this.logic.count.week,
				overdueCount: this.logic.count.overWeek,
				key: 3,
				id: "_myid4",
				taskObjectCategory: "关你啥事情4",
				noMove:true
			},
			{
				objectName: "创建清单",
				img: require('./imgs/add.png'),
				onPress: this.onPress1,
				color: true,
				id: "_myid5",
				taskObjectCategory: "关你啥事情5",
				noMove:true
			},
		]
		const data1 = [

		]
		const data2 = [...data, ...this.logic.list, ...data1]
		return (
			<View style={[styles.container]}>
				<StatusBar barStyle="light-content"/>
				<SearchBar logic={this.logic} navigation={this.props.navigation}/>
				<FlatList
					data={data2}
					keyExtractor={v => v.id + v.taskObjectCategory}
					contentContainerStyle={{width:width+(isAndroid?65:0)}}
					renderItem={({item}) => this.item(item)}
					 onRefresh={async () => {
					 	await this.getData()
					 }}
					 refreshing={this.logic.loading}
					extraData={this.logic.change}
				/>
				{this.logic.list.length>0&&<TouchableWithoutFeedback onPress={this.onPress}>
					<Image style={styles.bigButton} source={require("./imgs/add2.png")} resizeMode={'contain'}/>
				</TouchableWithoutFeedback>}
			</View>

		)
	}
}
export default withNavigationFocus(Home,"Home")