102 lines
3.6 KiB
JavaScript
102 lines
3.6 KiB
JavaScript
import React from "react";
|
|
import { View, Text, TouchableOpacity, ScrollView } from "react-native";
|
|
|
|
import Icon from "react-native-vector-icons/Entypo";
|
|
import { useFavoriteStation } from "../stateBox/useFavoriteStation";
|
|
import { useCurrentTrain } from "../stateBox/useCurrentTrain";
|
|
import { useNavigation } from "@react-navigation/native";
|
|
import { useTrainMenu } from "../stateBox/useTrainMenu";
|
|
import { FavoriteListItem } from "./atom/FavoriteListItem";
|
|
export default function FavoriteList() {
|
|
const { favoriteStation } = useFavoriteStation();
|
|
const { webview } = useCurrentTrain();
|
|
const { navigate, goBack } = useNavigation();
|
|
const { mapsStationData: stationData } = useTrainMenu();
|
|
|
|
return (
|
|
<View style={{ height: "100%", backgroundColor: "#0099CC" }}>
|
|
<Text
|
|
style={{
|
|
textAlign: "center",
|
|
fontSize: 20,
|
|
color: "white",
|
|
fontWeight: "bold",
|
|
paddingVertical: 10,
|
|
}}
|
|
>
|
|
位置情報クイック移動メニュー
|
|
</Text>
|
|
<ScrollView style={{ height: "100%", backgroundColor: "white" }}>
|
|
{favoriteStation
|
|
.filter((d) => d[0].StationMap)
|
|
.map((currentStation) => {
|
|
return (
|
|
<FavoriteListItem
|
|
currentStation={currentStation}
|
|
onPress={() => {
|
|
const getStationLine = (now) => {
|
|
const returnData = Object.keys(stationData).filter((d) => {
|
|
const cache = stationData[d].findIndex(
|
|
(data) => data.Station_JP == now.Station_JP
|
|
);
|
|
return cache != -1;
|
|
});
|
|
return returnData[0];
|
|
};
|
|
const lineName = getStationLine(currentStation[0]);
|
|
|
|
webview.current?.injectJavaScript(
|
|
`MoveDisplayStation('${lineName}_${currentStation[0].MyStation}_${currentStation[0].Station_JP}');
|
|
document.getElementById("disp").insertAdjacentHTML("afterbegin", "<div />");`
|
|
);
|
|
navigate("Apps");
|
|
}}
|
|
>
|
|
<View
|
|
style={{
|
|
flex: 2,
|
|
flexDirection: "row",
|
|
alignContent: "center",
|
|
alignItems: "center",
|
|
marginVertical: 4,
|
|
}}
|
|
>
|
|
<View style={{ flex: 1 }} />
|
|
<Text style={{ fontSize: 20 }}>移動する</Text>
|
|
<Icon name="chevron-right" size={20} />
|
|
</View>
|
|
</FavoriteListItem>
|
|
);
|
|
})}
|
|
</ScrollView>
|
|
<Text
|
|
style={{
|
|
backgroundColor: "white",
|
|
borderWidth: 1,
|
|
borderStyle: "solid",
|
|
}}
|
|
>
|
|
お気に入り登録した駅のうち、位置情報システムで移動可能な駅が表示されています。タップすることで位置情報システムの当該の駅に移動します。
|
|
</Text>
|
|
<TouchableOpacity
|
|
style={{
|
|
padding: 10,
|
|
flexDirection: "row",
|
|
borderColor: "white",
|
|
borderWidth: 1,
|
|
margin: 10,
|
|
borderRadius: 5,
|
|
alignItems: "center",
|
|
}}
|
|
onPress={() => goBack()}
|
|
>
|
|
<View style={{ flex: 1 }} />
|
|
<Text style={{ fontSize: 25, fontWeight: "bold", color: "white" }}>
|
|
閉じる
|
|
</Text>
|
|
<View style={{ flex: 1 }} />
|
|
</TouchableOpacity>
|
|
</View>
|
|
);
|
|
}
|