Skip to content

Commit

Permalink
closes #98, #99, #100. Add 'ended' badge, format activity card, and a…
Browse files Browse the repository at this point in the history 
…dd activities sorting …

closes #98, #99, #100. Add 'ended' badge, format activity card, and add activities sorting …
  • Loading branch information
@1989ONCE
1989ONCE authored Dec 8, 2023
2 parents 6755089 + 86742b6 commit 34d7245
Show file tree
Hide file tree
Showing 8 changed files with 248 additions and 282 deletions.
77 changes: 44 additions & 33 deletions controller/Active.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -6,7 +6,7 @@
import { getApp } from 'firebase/app'
import {
getFirestore, collection, query, getDoc, getDocs, addDoc,
setDoc, doc, orderBy, where, deleteDoc, deleteField, updateDoc, FieldValue, arrayRemove
setDoc, doc, orderBy, where, deleteDoc, deleteField, updateDoc, arrayRemove,
} from 'firebase/firestore'
import {
getStorage,
Expand Down Expand Up @@ -382,9 +382,6 @@ async function getAllActive () {
limitNum: doc1.data().limitNum,
genre: doc1.data().genre,
link: doc1.data().link,
hostName: doc1.data().hostName,
hostPhone: doc1.data().hostPhone,
hostMail: doc1.data().hostMail,
details: doc1.data().details
})
})
Expand All @@ -397,6 +394,7 @@ async function getAllActive () {
* @property {*} db - the reference of the firestore
* @property {*} activesRef - the reference of the activities collection
* @property {*} querySnapshot - the snapshot of the activesRef
* @property {timestamp} current - the current time
*
* @returns {object} GenreArray - the array of all activities
*/
Expand All @@ -406,6 +404,7 @@ async function getGenreActive (genre) {
const activesRef = query(collection(db, 'activities'), where('genre', '==', genre))
const GenreArray = []
const querySnapshot = await getDocs(activesRef)
const current = new Date()

querySnapshot.forEach((doc1) => {
GenreArray.push({
Expand All @@ -414,6 +413,7 @@ async function getGenreActive (genre) {
imageUri1: doc1.data().imageUri1,
imageUri2: doc1.data().imageUri2,
imageUri3: doc1.data().imageUri3,
endtimeTimestamp: doc1.data().endTime.toDate(),
startTime: toDateString(doc1.data().startTime.toDate()),
endTime: toDateString(doc1.data().endTime.toDate()),
startTimeWeekday: dateToWeekday(doc1.data().startTime.toDate()),
Expand All @@ -423,13 +423,13 @@ async function getGenreActive (genre) {
limitNum: doc1.data().limitNum,
genre: doc1.data().genre,
link: doc1.data().link,
hostName: doc1.data().hostName,
hostPhone: doc1.data().hostPhone,
hostMail: doc1.data().hostMail,
details: doc1.data().details
details: doc1.data().details,
finish: doc1.data().endTime.toDate() < current
})
})
return GenreArray
// 按照結束時間排序 - 由未結束到已結束
var sortedGenreArray = GenreArray.sort((a, b) => { return b.endtimeTimestamp - a.endtimeTimestamp })
return sortedGenreArray
}

/**
Expand Down Expand Up @@ -468,22 +468,22 @@ async function getParticipatedActive () {
name: result.data().name,
imageUri1: result.data().imageUri1,
time: dateToWeekdayWithoutTime(result.data().startTime.toDate()),
starttimeTimestamp: result.data().startTime.toDate(),
startTimeWeekday: dateToWeekday(result.data().startTime.toDate()),
startTimeInNum: toDateString(result.data().startTime.toDate()),
place: result.data().place.length < 10 ? result.data().place : result.data().place.slice(0, 8) + '...',
cost: result.data().cost,
limitNum: result.data().limitNum,
genre: result.data().genre,
link: result.data().link,
hostName: result.data().hostName,
hostPhone: result.data().hostPhone,
hostMail: result.data().hostMail,
details: result.data().details,
num: result.data().totalAttendee
})
}
}
return activeArray
// 按照開始時間排序 - 由近到遠
var sortedActiveArray = activeArray.sort((a, b) => { return a.starttimeTimestamp - b.starttimeTimestamp })
return sortedActiveArray
}

/**
Expand Down Expand Up @@ -526,14 +526,14 @@ async function getFinishedActive () {
limitNum: result.data().limitNum,
genre: result.data().genre,
link: result.data().link,
hostName: result.data().hostName,
hostPhone: result.data().hostPhone,
hostMail: result.data().hostMail,
details: result.data().details,
num: result.data().totalAttendee
num: result.data().totalAttendee,
endtimeTimestamp: result.data().endTime.toDate()
})
}
}
// 按照結束時間排序 - 由先結束的 到 後結束的
var sortedActiveArray = activeArray.sort((a, b) => { return a.endtimeTimestamp - b.endtimeTimestamp })
return activeArray
}

Expand Down Expand Up @@ -569,9 +569,6 @@ async function getOneActive (id) {
genre: querySnapshot.data().genre,
genreIndex: querySnapshot.data().genreIndex,
link: querySnapshot.data().link,
hostName: querySnapshot.data().hostName,
hostPhone: querySnapshot.data().hostPhone,
hostMail: querySnapshot.data().hostMail,
details: querySnapshot.data().details,
totalAttendee: querySnapshot.data().totalAttendee,
CloseEvent: querySnapshot.data().CloseEvent
Expand All @@ -592,6 +589,7 @@ async function getOneActive (id) {
* @property {*} db - the reference of the firestore
* @property {*} activesRef - the reference of the activity
* @property {*} querySnapshot - the snapshot of the activesRef
* @property {timestamp} current - the current time
*
* @returns {object} GenreArray - the array of activities of corresponding genre
*/
Expand All @@ -601,13 +599,16 @@ async function getHangOutActive () {
const activesRef = query(collection(db, 'activities'), where('genre', 'in', ['揪人遊戲', '揪人共乘', '揪人運動']))
const GenreArray = []
const querySnapshot = await getDocs(activesRef)
const current = new Date()

querySnapshot.forEach((doc1) => {
GenreArray.push({
id: doc1.id,
name: doc1.data().name,
imageUri1: doc1.data().imageUri1,
imageUri2: doc1.data().imageUri2,
imageUri3: doc1.data().imageUri3,
endtimeTimestamp: doc1.data().endTime.toDate(),
startTime: toDateString(doc1.data().startTime.toDate()),
endTime: toDateString(doc1.data().endTime.toDate()),
startTimeWeekday: dateToWeekday(doc1.data().startTime.toDate()),
Expand All @@ -617,14 +618,13 @@ async function getHangOutActive () {
limitNum: doc1.data().limitNum,
genre: doc1.data().genre,
link: doc1.data().link,
hostName: doc1.data().hostName,
hostPhone: doc1.data().hostPhone,
hostMail: doc1.data().hostMail,
details: doc1.data().details
details: doc1.data().details,
finish: doc1.data().endTime.toDate() < current
})
})
console.log('GenreArray', GenreArray)
return GenreArray
// 按照結束時間排序 - 由未結束到已結束
var sortedGenreArray = GenreArray.sort((a, b) => { return b.endtimeTimestamp - a.endtimeTimestamp })
return sortedGenreArray
}


Expand All @@ -634,6 +634,7 @@ async function getHangOutActive () {
* @property {*} db - the reference of the firestore
* @property {*} activesRef - the reference of the activity
* @property {*} querySnapshot - the snapshot of the activesRef
* @property {timestamp} current - the current time
*
* @returns {object} EventArray - the array of activities of corresponding genre
*/
Expand All @@ -643,13 +644,16 @@ async function getEventActive () {
const activesRef = query(collection(db, 'activities'), where('genre', 'in', ['校園活動', '系上活動', '社團活動']))
const EventArray = []
const querySnapshot = await getDocs(activesRef)
const current = new Date()

querySnapshot.forEach((doc1) => {
EventArray.push({
id: doc1.id,
name: doc1.data().name,
imageUri1: doc1.data().imageUri1,
imageUri2: doc1.data().imageUri2,
imageUri3: doc1.data().imageUri3,
endtimeTimestamp: doc1.data().endTime.toDate(),
startTime: toDateString(doc1.data().startTime.toDate()),
endTime: toDateString(doc1.data().endTime.toDate()),
startTimeWeekday: dateToWeekday(doc1.data().startTime.toDate()),
Expand All @@ -659,10 +663,13 @@ async function getEventActive () {
limitNum: doc1.data().limitNum,
genre: doc1.data().genre,
link: doc1.data().link,
details: doc1.data().details
details: doc1.data().details,
finish: doc1.data().endTime.toDate() < current
})
})
return EventArray
// 按照結束時間排序 - 由未結束到已結束
var sortedEventArray = EventArray.sort((a, b) => { return b.endtimeTimestamp - a.endtimeTimestamp })
return sortedEventArray
}

/**
Expand Down Expand Up @@ -736,7 +743,10 @@ async function getAllAttendees (docID) {
for (let j = 0; j < IDlist.length; j += 1) {
const infoDoc = doc(db, `attendees/${IDlist[j]}`)
const querySnapshot2 = await getDoc(infoDoc)
info.push({ uid: querySnapshot2.id, ...querySnapshot2.data() })
info.push({
uid: querySnapshot2.id,
...querySnapshot2.data()
})
}
return info
}
Expand Down Expand Up @@ -884,13 +894,14 @@ async function getHostedEvent () {
limitNum: result.data().limitNum,
genre: result.data().genre,
link: result.data().link,
hostName: result.data().hostName,
hostPhone: result.data().hostPhone,
hostMail: result.data().hostMail,
details: result.data().details,
num: result.data().totalAttendee
num: result.data().totalAttendee,
finish: result.data().endTime.toDate() < new Date(),
endtimeTimestamp: result.data().endTime.toDate()
})
}
// 按照時間排序 - 由未結束到已結束
var sortedEventArray = eventArray.sort((a, b) => { return b.endtimeTimestamp - a.endtimeTimestamp })
return eventArray
}

Expand Down
58 changes: 23 additions & 35 deletions screens/Event/GenreEvent.jsx
View file
Original file line number Diff line number Diff line change
@@ -1,13 +1,13 @@
import React, { useState, useEffect } from 'react'
import {
Text, RefreshControl, Image
RefreshControl, Image
} from 'react-native'
import { Title } from 'react-native-paper'
import {
Ionicons, FontAwesome5, AntDesign, Feather, Octicons
} from '@expo/vector-icons'
import {
NativeBaseProvider, Box, FlatList, VStack, Pressable, HStack, Center, ZStack
NativeBaseProvider, Box, FlatList, VStack, Pressable, HStack, Center, ZStack, Badge, Text
} from 'native-base'
import styles from './style_folder/Styles_moreEvent'
import ActiveController from '../../controller/Active'
Expand Down Expand Up @@ -107,6 +107,7 @@ function Genre ({ navigation, route }) {
</HStack>
</Box>
<Box style={styles.bodyContainer}>
{((active.length != 0) ? (
<FlatList
numColumns={2}
data={active}
Expand All @@ -124,42 +125,29 @@ function Genre ({ navigation, route }) {
navigation.navigate('details', { Cd: item.id, prepage: 'more' })
}}
>
<VStack style={styles.CardInMore}>
<Image
style={styles.pic}
source={{
uri: item.imageUri1
}}
/>
<Title style={styles.CardTitle}>
{item.name}
</Title>
<Box style={styles.CardStartTime}>
<AntDesign
name="clockcircleo"
size={12}
color="rgba(40, 82, 122, 0.65)"
<ZStack style={styles.CardInMore}>
<VStack w={'100%'}>
<Image
style={styles.pic}
source={{
uri: item.imageUri1
}}
/>
<Text style={styles.CardTimeText}>
{' '}
{item.startTime}
</Text>
</Box>
<Box style={styles.CardPlace}>
<Ionicons
name="location-outline"
size={15}
color="rgba(40, 82, 122, 0.65)"
/>
<Text style={styles.cardPlaceText}>
{' '}
{item.place}
</Text>
</Box>
</VStack>
<VStack p={2}>
<Text fontSize="xs" bold color="gray.600">
{item.startTimeWeekday}
</Text>
<Text fontSize="md" bold color="primary.600">
{item.name}
</Text>
</VStack>
</VStack>
<Box alignSelf={'flex-end'}>{(item.finish && (<Badge variant={'solid'}>已結束</Badge>))}</Box>
</ZStack>
</Pressable>
)}
/>
/>)
: (<Box w={'full'} h={'full'} justifyContent={'center'}><Center><Text fontSize="xl">目前尚無任何活動</Text></Center></Box>))}
</Box>

</Box>
Expand Down
Loading

0 comments on commit 34d7245

Please sign in to comment.