@olea-bps/base 1.1.9 → 1.1.11
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/components/ComponentJobsFilter/index.js +136 -135
- package/components/CourseDetailDialog/index.js +100 -100
- package/components/NewsDetail/index.js +229 -289
- package/components/NewsDetail/styles.js +3 -4
- package/components/RoomDetail/index.js +240 -212
- package/components/TimetableDay/index.js +211 -212
- package/components/TimetableMonth/index.js +57 -60
- package/components/TimetableWeek/index.js +72 -75
- package/package.json +10 -8
|
@@ -12,19 +12,17 @@
|
|
|
12
12
|
* limitations under the License.
|
|
13
13
|
*/
|
|
14
14
|
|
|
15
|
-
import React from 'react'
|
|
16
|
-
import {FlatList, SafeAreaView, StyleSheet, View} from 'react-native'
|
|
17
|
-
import {connect} from 'react-redux'
|
|
18
|
-
import {withTranslation} from
|
|
19
|
-
import {Appbar, withTheme} from
|
|
15
|
+
import React from 'react'
|
|
16
|
+
import { FlatList, SafeAreaView, StyleSheet, View } from 'react-native'
|
|
17
|
+
import { connect } from 'react-redux'
|
|
18
|
+
import { withTranslation } from 'react-i18next'
|
|
19
|
+
import { Appbar, withTheme } from 'react-native-paper'
|
|
20
20
|
import { CheckBox } from 'react-native-elements'
|
|
21
21
|
|
|
22
|
-
import merge from 'lodash/merge'
|
|
23
|
-
import componentStyles from
|
|
24
|
-
import AppbarComponent from '../AppBar'
|
|
25
|
-
import IconsOpenasist from '../../libraries/icons-openasist'
|
|
26
|
-
|
|
27
|
-
|
|
22
|
+
import merge from 'lodash/merge'
|
|
23
|
+
import componentStyles from './styles'
|
|
24
|
+
import AppbarComponent from '../AppBar'
|
|
25
|
+
import IconsOpenasist from '../../libraries/icons-openasist'
|
|
28
26
|
|
|
29
27
|
/**
|
|
30
28
|
* JobPortalFilter View
|
|
@@ -38,151 +36,154 @@ import IconsOpenasist from '../../libraries/icons-openasist';
|
|
|
38
36
|
* - none
|
|
39
37
|
*/
|
|
40
38
|
class JobFilterComponent extends React.Component {
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
state = {
|
|
46
|
-
data: null,
|
|
47
|
-
selectedIds: [],
|
|
48
|
-
checked: []
|
|
49
|
-
};
|
|
50
|
-
|
|
51
|
-
// Styles of this component
|
|
52
|
-
styles;
|
|
53
|
-
|
|
54
|
-
checked;
|
|
55
|
-
|
|
56
|
-
selectedIds;
|
|
57
|
-
|
|
58
|
-
catData;
|
|
59
|
-
|
|
60
|
-
constructor(props) {
|
|
61
|
-
super(props);
|
|
62
|
-
// ------------------------------------------------------------------------
|
|
63
|
-
// PLUGIN FUNCTIONALITY
|
|
64
|
-
// ------------------------------------------------------------------------
|
|
65
|
-
const {pluginStyles, theme} = this.props;
|
|
66
|
-
this.styles = componentStyles(theme);
|
|
67
|
-
if (pluginStyles) {
|
|
68
|
-
this.styles = merge(this.styles, pluginStyles);
|
|
69
|
-
}
|
|
70
|
-
this.styles = StyleSheet.create(this.styles);
|
|
71
|
-
// ------------------------------------------------------------------------
|
|
39
|
+
static navigationOptions = {
|
|
40
|
+
header: null
|
|
41
|
+
}
|
|
72
42
|
|
|
73
|
-
|
|
43
|
+
state = {
|
|
44
|
+
data: null,
|
|
45
|
+
selectedIds: [],
|
|
46
|
+
checked: []
|
|
47
|
+
}
|
|
74
48
|
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
checked: this.props.route.params.checked,
|
|
78
|
-
selectedIds: this.props.route.params.selectedIds,
|
|
79
|
-
data: this.props.route.params.catData
|
|
80
|
-
});
|
|
81
|
-
}
|
|
49
|
+
// Styles of this component
|
|
50
|
+
styles
|
|
82
51
|
|
|
83
|
-
|
|
84
|
-
const { navigation, route } = this.props;
|
|
85
|
-
navigation.navigate('Job', {
|
|
86
|
-
selectedIds: this.state.selectedIds,
|
|
87
|
-
checked: this.state.checked
|
|
88
|
-
});
|
|
89
|
-
}
|
|
52
|
+
checked
|
|
90
53
|
|
|
54
|
+
selectedIds
|
|
91
55
|
|
|
56
|
+
catData
|
|
92
57
|
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
58
|
+
constructor (props) {
|
|
59
|
+
super(props)
|
|
60
|
+
// ------------------------------------------------------------------------
|
|
61
|
+
// PLUGIN FUNCTIONALITY
|
|
62
|
+
// ------------------------------------------------------------------------
|
|
63
|
+
const { pluginStyles, theme } = this.props
|
|
64
|
+
this.styles = componentStyles(theme)
|
|
65
|
+
if (pluginStyles) {
|
|
66
|
+
this.styles = merge(this.styles, pluginStyles)
|
|
100
67
|
}
|
|
68
|
+
this.styles = StyleSheet.create(this.styles)
|
|
69
|
+
// ------------------------------------------------------------------------
|
|
70
|
+
}
|
|
101
71
|
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
}
|
|
110
|
-
}
|
|
111
|
-
return selectedIds;
|
|
112
|
-
}
|
|
72
|
+
componentDidMount () {
|
|
73
|
+
this.setState((_prevState, props) => ({
|
|
74
|
+
checked: props.route.params.checked,
|
|
75
|
+
selectedIds: props.route.params.selectedIds,
|
|
76
|
+
data: props.route.params.catData
|
|
77
|
+
}))
|
|
78
|
+
}
|
|
113
79
|
|
|
114
|
-
|
|
115
|
-
|
|
116
|
-
|
|
117
|
-
|
|
118
|
-
|
|
119
|
-
|
|
120
|
-
|
|
121
|
-
|
|
122
|
-
|
|
123
|
-
|
|
124
|
-
|
|
125
|
-
|
|
126
|
-
|
|
127
|
-
|
|
128
|
-
|
|
129
|
-
|
|
130
|
-
textStyle={this.styles.title}
|
|
131
|
-
onPress={() => this.handleChange(index)}
|
|
132
|
-
checkedColor={colors.primary}
|
|
133
|
-
/>
|
|
134
|
-
}
|
|
135
|
-
keyExtractor={this._keyExtractor}
|
|
136
|
-
/>
|
|
80
|
+
goBack () {
|
|
81
|
+
const { navigation } = this.props
|
|
82
|
+
|
|
83
|
+
navigation.popTo('Job', {
|
|
84
|
+
selectedIds: this.state.selectedIds,
|
|
85
|
+
checked: this.state.checked
|
|
86
|
+
})
|
|
87
|
+
}
|
|
88
|
+
|
|
89
|
+
handleChange = (index) => {
|
|
90
|
+
this.setState(prevState => {
|
|
91
|
+
const checked = [...prevState.checked]
|
|
92
|
+
const selectedIds = this.addOrRemSelectedIds(
|
|
93
|
+
prevState.data,
|
|
94
|
+
index,
|
|
95
|
+
[...prevState.selectedIds]
|
|
137
96
|
)
|
|
97
|
+
|
|
98
|
+
checked[index] = !checked[index]
|
|
99
|
+
|
|
100
|
+
return { checked, selectedIds }
|
|
101
|
+
})
|
|
102
|
+
}
|
|
103
|
+
|
|
104
|
+
addOrRemSelectedIds = (data, index, selectedIds) => {
|
|
105
|
+
for (let i = 0; i < data[index].id.length; i++) {
|
|
106
|
+
const value = data[index].id[i]
|
|
107
|
+
if (selectedIds.indexOf(value) === -1) {
|
|
108
|
+
selectedIds.push(value)
|
|
109
|
+
} else {
|
|
110
|
+
selectedIds.splice(selectedIds.indexOf(value), 1)
|
|
111
|
+
}
|
|
138
112
|
}
|
|
113
|
+
return selectedIds
|
|
114
|
+
}
|
|
115
|
+
|
|
116
|
+
_keyExtractor = (item, index) => {
|
|
117
|
+
return item?.name ?? index.toString()
|
|
118
|
+
}
|
|
119
|
+
|
|
120
|
+
_renderListView = () => {
|
|
121
|
+
const { colors } = this.props.theme
|
|
122
|
+
const { data, checked } = this.state
|
|
123
|
+
|
|
124
|
+
return (
|
|
125
|
+
<FlatList
|
|
126
|
+
data={data}
|
|
127
|
+
extraData={this.state}
|
|
128
|
+
renderItem={({ item, index }) =>
|
|
129
|
+
<CheckBox
|
|
130
|
+
checked={checked[index]}
|
|
131
|
+
title={item.name}
|
|
132
|
+
textStyle={this.styles.title}
|
|
133
|
+
onPress={() => this.handleChange(index)}
|
|
134
|
+
checkedColor={colors.primary}
|
|
135
|
+
/>}
|
|
136
|
+
keyExtractor={this._keyExtractor}
|
|
137
|
+
/>
|
|
138
|
+
)
|
|
139
|
+
}
|
|
139
140
|
|
|
140
|
-
|
|
141
|
+
/**
|
|
141
142
|
* Tab for services
|
|
142
143
|
* @returns {*}
|
|
143
144
|
* @constructor
|
|
144
145
|
*/
|
|
145
146
|
|
|
146
|
-
render() {
|
|
147
|
-
|
|
148
|
-
|
|
149
|
-
|
|
150
|
-
|
|
151
|
-
|
|
152
|
-
|
|
153
|
-
|
|
154
|
-
|
|
155
|
-
|
|
156
|
-
|
|
157
|
-
|
|
158
|
-
|
|
159
|
-
|
|
160
|
-
|
|
161
|
-
|
|
162
|
-
|
|
163
|
-
|
|
164
|
-
|
|
165
|
-
|
|
166
|
-
|
|
167
|
-
|
|
168
|
-
|
|
147
|
+
render () {
|
|
148
|
+
// ------------------------------------------------------------------------
|
|
149
|
+
// PLUGIN FUNCTIONALITY
|
|
150
|
+
// ------------------------------------------------------------------------
|
|
151
|
+
const PluginComponent = this.props.pluginComponent
|
|
152
|
+
if (PluginComponent) {
|
|
153
|
+
return <PluginComponent />
|
|
154
|
+
}
|
|
155
|
+
// ------------------------------------------------------------------------
|
|
156
|
+
const { colors, themeStyles } = this.props.theme
|
|
157
|
+
|
|
158
|
+
return (
|
|
159
|
+
<SafeAreaView style={[this.styles.container, themeStyles.appSafeAreaContainer]}>
|
|
160
|
+
<View>
|
|
161
|
+
<AppbarComponent
|
|
162
|
+
{...this.props}
|
|
163
|
+
title='Filter'
|
|
164
|
+
leftAction={
|
|
165
|
+
<Appbar.Action
|
|
166
|
+
icon={props => <IconsOpenasist {...props} icon='back' color={colors.primaryText} />}
|
|
167
|
+
onPress={() => {
|
|
168
|
+
this.goBack()
|
|
169
|
+
}}
|
|
170
|
+
/>
|
|
169
171
|
}
|
|
170
|
-
|
|
171
|
-
|
|
172
|
-
|
|
173
|
-
|
|
174
|
-
|
|
175
|
-
|
|
176
|
-
)
|
|
172
|
+
/>
|
|
173
|
+
</View>
|
|
174
|
+
<View style={themeStyles.container}>
|
|
175
|
+
{this._renderListView()}
|
|
176
|
+
</View>
|
|
177
|
+
</SafeAreaView>
|
|
178
|
+
)
|
|
177
179
|
}
|
|
178
180
|
}
|
|
179
181
|
|
|
180
|
-
|
|
181
182
|
const mapStateToProps = state => {
|
|
182
|
-
|
|
183
|
-
|
|
184
|
-
|
|
185
|
-
|
|
186
|
-
}
|
|
183
|
+
return {
|
|
184
|
+
pluginComponent: state.pluginReducer.jobFilter.component,
|
|
185
|
+
pluginStyles: state.pluginReducer.jobFilter.styles
|
|
186
|
+
}
|
|
187
|
+
}
|
|
187
188
|
|
|
188
189
|
export default connect(mapStateToProps, null)(withTranslation()(withTheme(JobFilterComponent)))
|
|
@@ -12,20 +12,20 @@
|
|
|
12
12
|
* limitations under the License.
|
|
13
13
|
*/
|
|
14
14
|
|
|
15
|
-
import { useMemo } from 'react'
|
|
15
|
+
import { useMemo } from 'react'
|
|
16
16
|
import {
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
} from 'react-native'
|
|
17
|
+
StyleSheet,
|
|
18
|
+
Linking,
|
|
19
|
+
TouchableOpacity
|
|
20
|
+
} from 'react-native'
|
|
21
21
|
|
|
22
|
-
import { useTheme, Text, Dialog, Portal } from 'react-native-paper'
|
|
23
|
-
import { useTranslation } from 'react-i18next'
|
|
22
|
+
import { useTheme, Text, Dialog, Portal } from 'react-native-paper'
|
|
23
|
+
import { useTranslation } from 'react-i18next'
|
|
24
24
|
|
|
25
|
-
import IconsOpenasist from '../../libraries/icons-openasist'
|
|
26
|
-
import { useIncreaseFontSize } from '../../libraries/core'
|
|
25
|
+
import IconsOpenasist from '../../libraries/icons-openasist'
|
|
26
|
+
import { useIncreaseFontSize } from '../../libraries/core'
|
|
27
27
|
|
|
28
|
-
import componentStyles from './styles'
|
|
28
|
+
import componentStyles from './styles'
|
|
29
29
|
|
|
30
30
|
/**
|
|
31
31
|
* Ein Dialog, der sich über die derzeitige Ansicht legt, welcher die Detailinformationen zu einer Vorlesung anzeigt.
|
|
@@ -53,70 +53,72 @@ import componentStyles from './styles';
|
|
|
53
53
|
* />
|
|
54
54
|
* );
|
|
55
55
|
*/
|
|
56
|
-
export default function CourseDetailDialog({ course, visible, onClose, onDismiss }) {
|
|
57
|
-
|
|
58
|
-
|
|
56
|
+
export default function CourseDetailDialog ({ course, visible, onClose, onDismiss }) {
|
|
57
|
+
const theme = useTheme()
|
|
58
|
+
const { t } = useTranslation()
|
|
59
59
|
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
60
|
+
const styles = useMemo(
|
|
61
|
+
() => StyleSheet.create(componentStyles(theme)),
|
|
62
|
+
[theme]
|
|
63
|
+
)
|
|
64
64
|
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
65
|
+
const { room, url, info, title, times, type, lecturer, addon, ...extraCourseData } = course ?? {}
|
|
66
|
+
const courseDetails = [
|
|
67
|
+
{ ...room, key: 'room', displayName: t('timetable:detail.room'), icon: 'map-search' },
|
|
68
|
+
{ key: 'startTimes', data: times?.[0]?.start, displayName: t('timetable:detail.start') },
|
|
69
|
+
{ key: 'endTimes', data: times?.[0]?.end, displayName: t('timetable:detail.end') },
|
|
70
|
+
{ ...type, key: 'type', displayName: t('timetable:detail.type') },
|
|
71
|
+
{ ...lecturer?.[0], key: 'lecturer', displayName: t('timetable:detail.lecturer') },
|
|
72
|
+
{ ...url, key: 'url', displayName: t('timetable:detail.url'), icon: 'forward' },
|
|
73
|
+
{ ...info, key: 'info', displayName: t('timetable:detail.info') },
|
|
74
|
+
{ ...addon, key: 'addon', displayName: t('timetable:detail.addon') },
|
|
74
75
|
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
76
|
+
// Restliche Daten werden in Format gebracht und angefügt
|
|
77
|
+
...Object.entries(extraCourseData)
|
|
78
|
+
.map(
|
|
79
|
+
([courseDataKey, courseDataValue]) =>
|
|
80
|
+
(
|
|
81
|
+
{
|
|
82
|
+
key: courseDataKey,
|
|
83
|
+
displayName: courseDataValue?.displayname,
|
|
84
|
+
...courseDataValue
|
|
85
|
+
}
|
|
86
|
+
)
|
|
87
|
+
)
|
|
88
|
+
]
|
|
89
|
+
.filter(courseDetail => !!courseDetail?.data)
|
|
89
90
|
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
|
|
114
|
-
|
|
115
|
-
|
|
116
|
-
|
|
117
|
-
|
|
118
|
-
|
|
119
|
-
|
|
91
|
+
return (
|
|
92
|
+
<Portal>
|
|
93
|
+
<Dialog visible={visible} onDismiss={onDismiss}>
|
|
94
|
+
<Dialog.Title>{title?.data ?? 'Keine weiteren Informationen'}</Dialog.Title>
|
|
95
|
+
<Dialog.Content>
|
|
96
|
+
{courseDetails
|
|
97
|
+
? (
|
|
98
|
+
courseDetails.map(courseDetail => (
|
|
99
|
+
<CourseDetailDialogText
|
|
100
|
+
key={courseDetail?.displayName}
|
|
101
|
+
title={courseDetail?.displayName}
|
|
102
|
+
content={courseDetail?.data}
|
|
103
|
+
url={courseDetail?.url}
|
|
104
|
+
icon={courseDetail?.icon}
|
|
105
|
+
/>
|
|
106
|
+
))
|
|
107
|
+
)
|
|
108
|
+
: (
|
|
109
|
+
<Text>
|
|
110
|
+
Keine Informationen verfügbar
|
|
111
|
+
</Text>
|
|
112
|
+
)}
|
|
113
|
+
</Dialog.Content>
|
|
114
|
+
<Dialog.Actions>
|
|
115
|
+
<TouchableOpacity onPress={onClose}>
|
|
116
|
+
<Text style={styles.dismissButton}>{t('timetable:close')}</Text>
|
|
117
|
+
</TouchableOpacity>
|
|
118
|
+
</Dialog.Actions>
|
|
119
|
+
</Dialog>
|
|
120
|
+
</Portal>
|
|
121
|
+
)
|
|
120
122
|
}
|
|
121
123
|
|
|
122
124
|
/**
|
|
@@ -128,42 +130,40 @@ export default function CourseDetailDialog({ course, visible, onClose, onDismiss
|
|
|
128
130
|
* @param {string} props.url
|
|
129
131
|
* @param {string} props.icon
|
|
130
132
|
*/
|
|
131
|
-
function CourseDetailDialogText({ title, content, url, icon }) {
|
|
132
|
-
|
|
133
|
+
function CourseDetailDialogText ({ title, content, url, icon }) {
|
|
134
|
+
const increaseFontSize = useIncreaseFontSize()
|
|
133
135
|
|
|
134
|
-
|
|
135
|
-
|
|
136
|
+
const theme = useTheme()
|
|
137
|
+
const { colors } = theme
|
|
136
138
|
|
|
137
|
-
|
|
138
|
-
|
|
139
|
-
|
|
140
|
-
|
|
139
|
+
const styles = useMemo(
|
|
140
|
+
() => StyleSheet.create(componentStyles(theme)),
|
|
141
|
+
[theme]
|
|
142
|
+
)
|
|
141
143
|
|
|
142
|
-
|
|
143
|
-
|
|
144
|
-
|
|
145
|
-
|
|
144
|
+
return (
|
|
145
|
+
<TouchableOpacity
|
|
146
|
+
style={[styles.detailContainer, styles.textDetail]}
|
|
147
|
+
onPress={
|
|
146
148
|
url
|
|
147
|
-
|
|
148
|
-
|
|
149
|
+
? () => Linking.openURL(url)
|
|
150
|
+
: null
|
|
149
151
|
}
|
|
150
|
-
|
|
151
|
-
url
|
|
152
|
-
? false
|
|
153
|
-
: true
|
|
152
|
+
disabled={
|
|
153
|
+
!url
|
|
154
154
|
}
|
|
155
|
-
|
|
156
|
-
|
|
157
|
-
|
|
158
|
-
|
|
159
|
-
|
|
160
|
-
|
|
161
|
-
|
|
162
|
-
|
|
155
|
+
>
|
|
156
|
+
<Text style={[styles.detailLabel, increaseFontSize ? styles.textDetailBigFont : styles.textDetail]}>
|
|
157
|
+
{title}
|
|
158
|
+
</Text>
|
|
159
|
+
<Text style={[styles.detailValue, increaseFontSize ? styles.textDetailBigFont : styles.textDetail]} ellipsizeMode='tail'>
|
|
160
|
+
{content}
|
|
161
|
+
</Text>
|
|
162
|
+
{
|
|
163
163
|
icon && url
|
|
164
|
-
|
|
165
|
-
|
|
164
|
+
? <IconsOpenasist icon={icon} size={25} color={colors.icon} />
|
|
165
|
+
: null
|
|
166
166
|
}
|
|
167
|
-
|
|
168
|
-
|
|
167
|
+
</TouchableOpacity>
|
|
168
|
+
)
|
|
169
169
|
}
|