Show more services button on home

This commit is contained in:
Arnaud Vergnet 2020-04-04 13:52:16 +02:00
parent 20336c699e
commit 1ede8f4e9a
5 changed files with 90 additions and 9 deletions

View file

@ -0,0 +1,67 @@
// @flow
import * as React from 'react';
import {Button, Card, withTheme} from 'react-native-paper';
import {StyleSheet} from "react-native";
type Props = {
navigation: Object,
theme: Object,
}
class ActionsDashBoardItem extends React.PureComponent<Props> {
colors: Object;
constructor(props) {
super(props);
this.colors = this.props.theme.colors;
}
openDrawer = () => this.props.navigation.openDrawer();
render() {
return (
<Card style={{
...styles.card,
borderColor: this.colors.primary,
}}>
<Card.Content style={styles.content}>
<Button
icon="information"
mode="contained"
onPress={this.openDrawer}
style={styles.button}
>
PLUS DE SERVICES
</Button>
</Card.Content>
</Card>
);
}
}
const styles = StyleSheet.create({
card: {
width: 'auto',
marginLeft: 10,
marginRight: 10,
marginTop: 10,
overflow: 'hidden',
elevation: 4,
borderWidth: 1,
},
avatar: {
backgroundColor: 'transparent'
},
content: {
flex: 1,
flexDirection: 'row',
},
button: {
marginLeft: 'auto',
marginRight: 'auto',
}
});
export default withTheme(ActionsDashBoardItem);

View file

@ -8,7 +8,7 @@ import {View} from "react-native";
* @param props Props to pass to the component
* @return {*}
*/
function SquareDashboardItem(props) {
function SmallDashboardItem(props) {
const {colors} = props.theme;
return (
<View>
@ -37,4 +37,4 @@ function SquareDashboardItem(props) {
);
}
export default withTheme(SquareDashboardItem);
export default withTheme(SmallDashboardItem);

View file

@ -57,6 +57,7 @@ class SideBar extends React.PureComponent<Props, State> {
route: "LoginScreen",
icon: "login",
onlyWhenLoggedOut: true,
shouldEmphasis: true,
},
{
name: i18n.t('screens.profile'),
@ -206,6 +207,7 @@ class SideBar extends React.PureComponent<Props, State> {
const onListItemPress = this.onListItemPress.bind(this, item);
const onlyWhenLoggedOut = item.onlyWhenLoggedOut !== undefined && item.onlyWhenLoggedOut === true;
const onlyWhenLoggedIn = item.onlyWhenLoggedIn !== undefined && item.onlyWhenLoggedIn === true;
const shouldEmphasis = item.shouldEmphasis !== undefined && item.shouldEmphasis === true;
if (onlyWhenLoggedIn && !this.state.isLoggedIn || onlyWhenLoggedOut && this.state.isLoggedIn)
return null;
else if (item.icon !== undefined) {
@ -214,6 +216,7 @@ class SideBar extends React.PureComponent<Props, State> {
title={item.name}
icon={item.icon}
onPress={onListItemPress}
shouldEmphasis={shouldEmphasis}
/>
);
} else {

View file

@ -17,7 +17,7 @@ function SidebarItem(props) {
focused={false}
onPress={props.onPress}
icon={({color, size}) =>
<MaterialCommunityIcons color={color} size={size} name={props.icon}/>}
<MaterialCommunityIcons color={props.shouldEmphasis ? colors.primary : color} size={size} name={props.icon}/>}
style={{
marginLeft: 0,
marginRight: 0,

View file

@ -7,10 +7,11 @@ import DashboardItem from "../components/Home/EventDashboardItem";
import WebSectionList from "../components/Lists/WebSectionList";
import {Text, withTheme} from 'react-native-paper';
import FeedItem from "../components/Home/FeedItem";
import SquareDashboardItem from "../components/Home/SquareDashboardItem";
import SquareDashboardItem from "../components/Home/SmallDashboardItem";
import PreviewEventDashboardItem from "../components/Home/PreviewEventDashboardItem";
import {stringToDate} from "../utils/Planning";
import {openBrowser} from "../utils/WebBrowser";
import ActionsDashBoardItem from "../components/Home/ActionsDashboardItem";
// import DATA from "../dashboard_data.json";
@ -143,9 +144,13 @@ class HomeScreen extends React.Component<Props, State> {
let dataset = [
{
id: 'middle',
id: 'top',
content: []
},
{
id: 'actions',
content: undefined
},
{
id: 'event',
content: undefined
@ -154,7 +159,7 @@ class HomeScreen extends React.Component<Props, State> {
for (let [key, value] of Object.entries(dashboardData)) {
switch (key) {
case 'today_events':
dataset[1]['content'] = value;
dataset[2]['content'] = value;
break;
case 'available_machines':
dataset[0]['content'][0] = {id: key, data: value};
@ -184,8 +189,14 @@ class HomeScreen extends React.Component<Props, State> {
let content = item['content'];
if (item['id'] === 'event')
return this.getDashboardEventItem(content);
else if (item['id'] === 'middle')
return this.getDashboardMiddleItem(content);
else if (item['id'] === 'top')
return this.getDashboardTopItem(content);
else if (item['id'] === 'actions')
return this.getActionsDashboardItem();
}
getActionsDashboardItem() {
return <ActionsDashBoardItem {...this.props}/>;
}
/**
@ -359,7 +370,7 @@ class HomeScreen extends React.Component<Props, State> {
* @param content
* @return {*}
*/
getDashboardMiddleItem(content: Array<Object>) {
getDashboardTopItem(content: Array<Object>) {
let proxiwashData = content[0]['data'];
let tutorinsaData = content[1]['data'];
let proximoData = content[2]['data'];