82 lines
2.1 KiB
TypeScript
82 lines
2.1 KiB
TypeScript
import React, { FC } from "react";
|
|
import { View, Text, TouchableOpacity } from "react-native";
|
|
import lineColorList from "../../assets/originData/lineColorList";
|
|
|
|
|
|
type Props = {
|
|
currentStation: {
|
|
Station_JP: string;
|
|
StationNumber: string;
|
|
}[];
|
|
onPress: () => void;
|
|
children: React.ReactNode;
|
|
}
|
|
export const FavoriteListItem:FC<Props> = ({ currentStation, children, onPress }) => {
|
|
const lineIDs = [];
|
|
const EachIDs = [];
|
|
currentStation.forEach((d) => {
|
|
if (!d.StationNumber) return;
|
|
const textArray = d.StationNumber.split("");
|
|
lineIDs.push(textArray.filter((s) => "A" < s && s < "Z").join(""));
|
|
EachIDs.push(textArray.filter((s) => "0" <= s && s <= "9").join(""));
|
|
});
|
|
|
|
return (
|
|
<TouchableOpacity
|
|
style={{ flexDirection: "row", backgroundColor: "white" }}
|
|
onPress={onPress}
|
|
>
|
|
<View
|
|
style={{
|
|
width: 35,
|
|
position: "relative",
|
|
marginHorizontal: 15,
|
|
flexDirection: "row",
|
|
height: "101%",
|
|
}}
|
|
>
|
|
{lineIDs.map((lineID, index) => (
|
|
<View
|
|
style={{
|
|
backgroundColor: lineColorList[lineID],
|
|
flex: 1,
|
|
}}
|
|
key={lineID}
|
|
>
|
|
<View style={{ flex: 1 }} />
|
|
<Text
|
|
style={{
|
|
color: "white",
|
|
textAlign: "center",
|
|
fontSize: 12,
|
|
fontWeight: "bold",
|
|
}}
|
|
>
|
|
{lineIDs[index]}
|
|
{"\n"}
|
|
{EachIDs[index]}
|
|
</Text>
|
|
<View style={{ flex: 1 }} />
|
|
</View>
|
|
))}
|
|
</View>
|
|
|
|
<View
|
|
style={{
|
|
padding: 8,
|
|
flexDirection: "row",
|
|
borderBottomWidth: 1,
|
|
borderBottomColor: "#f0f0f0",
|
|
flex: 1,
|
|
alignContent: "center",
|
|
alignItems: "center",
|
|
}}
|
|
>
|
|
<Text style={{ fontSize: 20 }}>{currentStation[0].Station_JP}</Text>
|
|
<View style={{ flex: 1 }} />
|
|
{children}
|
|
</View>
|
|
</TouchableOpacity>
|
|
);
|
|
};
|