diff --git a/components/発車時刻表/EachData.tsx b/components/発車時刻表/EachData.tsx index 742ebe4..241edde 100644 --- a/components/発車時刻表/EachData.tsx +++ b/components/発車時刻表/EachData.tsx @@ -12,10 +12,8 @@ import { LastStation } from "./LED_inside_Component/LastStation"; import { StatusAndDelay } from "./LED_inside_Component/StatusAndDelay"; import { TrainName } from "./LED_inside_Component/TrainName"; import { customTrainDataDetector } from "../custom-train-data"; -import { trainDataType, trainPosition } from "../../lib/trainPositionTextArray"; -import { getStationID } from "../../lib/eachTrainInfoCoreLib/getStationData"; -import { useStationList } from "../../stateBox/useStationList"; -import { lineList } from "../../lib/getStationList"; +import { TrainPosition } from "./LED_inside_Component/TrainPosition"; +import { TrainPositionDataPush } from "./LED_inside_Component/TrainPositionDataPush"; type Props = { d: { @@ -42,15 +40,6 @@ export const EachData: FC = (props) => { openStationACFromEachTrainInfo, } = props; const { currentTrain } = useCurrentTrain(); - const { originalStationList } = useStationList(); - const stationList = - originalStationList && - lineList.map((d) => - originalStationList[d].map((a) => ({ - StationNumber: a.StationNumber, - StationName: a.Station_JP, - })) - ); const openTrainInfo = (d: { train: string; lastStation: string; @@ -97,6 +86,7 @@ export const EachData: FC = (props) => { } return customTrainData; }; + const [train, setTrain] = useState(getTrainDataFromCurrentTrain(d.train)); useEffect(() => { setTrain(getTrainDataFromCurrentTrain(d.train)); @@ -109,26 +99,9 @@ export const EachData: FC = (props) => { currentTrainData, station.Station_JP )}`; - const trainPositionText = (trainData: trainDataType) => { - const { isBetween, Pos } = trainPosition(trainData); - if (isBetween === true) return `現在地:${Pos.from}→${Pos.to}間を走行中`; - else return Pos.Pos == "" ? "" : `現在地:${Pos.Pos}`; - }; const [platformNumber, setPlatformNumber] = useState(); const [platformDescription, setPlatformDescription] = useState(); - useEffect(() => { - fetch( - `https://n8n.haruk.in/webhook/JR-shikoku-PosID?PosNum=${currentTrainData?.PosNum}&Line=${currentTrainData?.Line}` - ) - .then((res) => res.json()) - .then((data) => { - setPlatformNumber(data?.type == "Station" ? data?.platform : undefined); - setPlatformDescription( - data?.type == "Station" ? data?.description : undefined - ); - }); - }, [currentTrainData, currentTrain]); const [dialog, setDialog] = useState(false); const [posInput, setPosInput] = useState(""); @@ -137,50 +110,18 @@ export const EachData: FC = (props) => { const [stationNumberInput, setStationNumberInput] = useState(""); return ( <> - setDialog(false)}> - 路線: {currentTrainData?.Line} - 地点ID: {currentTrainData?.PosNum} - 駅名: {stationInput} - 駅ナンバー: {stationNumberInput} - - - + = (props) => { {trainDescriptionSwitch && ( - { - const { isBetween, Pos } = trainPosition(currentTrainData); - if (isBetween === true) return; - setStationInput(Pos.Pos); - setStationNumberInput( - getStationID(currentTrainData?.Pos, stationList) - ); - setDescInput(platformDescription || ""); - setPosInput(platformNumber?.toString() || ""); - setDialog(true); - }} + )} {trainDescriptionSwitch && !!train.info && ( diff --git a/components/発車時刻表/LED_inside_Component/TrainPosition.tsx b/components/発車時刻表/LED_inside_Component/TrainPosition.tsx new file mode 100644 index 0000000..f1dc0bf --- /dev/null +++ b/components/発車時刻表/LED_inside_Component/TrainPosition.tsx @@ -0,0 +1,113 @@ +import React, { FC, useEffect } from "react"; +import { Text, TextStyle, View, TouchableOpacity } from "react-native"; +import { useStationList } from "../../../stateBox/useStationList"; +import { + trainDataType, + trainPosition, +} from "../../../lib/trainPositionTextArray"; +import { lineList } from "../../../lib/getStationList"; +import { getStationID } from "../../../lib/eachTrainInfoCoreLib/getStationData"; +import { useCurrentTrain } from "../../../stateBox/useCurrentTrain"; + +const descriptionStyle: TextStyle = { + fontSize: parseInt("16%"), + fontWeight: "bold", +}; + +type Props = { + numberOfLines?: number; + trainIDSwitch: boolean; + currentTrainData: trainDataType; + setStationInput: (station: string) => void; + setStationNumberInput: (station: string) => void; + setDescInput: (desc: string) => void; + setPosInput: (pos: string) => void; + setDialog: (dialog: boolean) => void; + platformDescription: string; + platformNumber: number; + setPlatformDescription: (desc: string) => void; + setPlatformNumber: (num: number) => void; +}; + +export const TrainPosition: FC = ({ + numberOfLines = 0, + trainIDSwitch, + currentTrainData, + setStationInput, + setStationNumberInput, + setDescInput, + setPosInput, + setDialog, + setPlatformDescription, + setPlatformNumber, + platformDescription, + platformNumber, +}) => { + const { currentTrain } = useCurrentTrain(); + const { originalStationList } = useStationList(); + const stationList = + originalStationList && + lineList.map((d) => + originalStationList[d].map((a) => ({ + StationNumber: a.StationNumber, + StationName: a.Station_JP, + })) + ); + useEffect(() => { + fetch( + `https://n8n.haruk.in/webhook/JR-shikoku-PosID?PosNum=${currentTrainData?.PosNum}&Line=${currentTrainData?.Line}` + ) + .then((res) => res.json()) + .then((data: { type: string; platform: number; description: string }) => { + setPlatformNumber(data?.type == "Station" ? data?.platform : undefined); + setPlatformDescription( + data?.type == "Station" ? data?.description : undefined + ); + }); + }, [currentTrainData, currentTrain]); + + const trainPositionText = (trainData: trainDataType) => { + const { isBetween, Pos } = trainPosition(trainData); + if (isBetween === true) return `現在地:${Pos.from}→${Pos.to}間を走行中`; + else return Pos.Pos == "" ? "" : `現在地:${Pos.Pos}`; + }; + + return ( + { + const { isBetween, Pos } = trainPosition(currentTrainData); + if (isBetween === true) return; + setStationInput(Pos.Pos); + setStationNumberInput(getStationID(currentTrainData?.Pos, stationList)); + setDescInput(platformDescription || ""); + setPosInput(platformNumber?.toString() || ""); + setDialog(true); + }} + > + + + {`${ + trainIDSwitch + ? currentTrainData?.PosNum + currentTrainData?.Line + : trainPositionText(currentTrainData) + } ${platformNumber ? platformNumber + "番線" : ""} ${ + platformDescription ? "(" + platformDescription + ")" : "" + }`} + + + + ); +}; diff --git a/components/発車時刻表/LED_inside_Component/TrainPositionDataPush.tsx b/components/発車時刻表/LED_inside_Component/TrainPositionDataPush.tsx new file mode 100644 index 0000000..7bf8be2 --- /dev/null +++ b/components/発車時刻表/LED_inside_Component/TrainPositionDataPush.tsx @@ -0,0 +1,77 @@ +import React, { FC, useState } from "react"; +import { Text } from "react-native"; +import { Dialog, Input, Button } from "react-native-elements"; +import { trainDataType } from "../../../lib/trainPositionTextArray"; +import { useCurrentTrain } from "../../../stateBox/useCurrentTrain"; +type Props = { + dialog: boolean; + setDialog: (dialog: boolean) => void; + currentTrainData: trainDataType; + stationInput: string; + stationNumberInput: string; + posInput: string; + descInput: string; + setPosInput: (pos: string) => void; + setDescInput: (desc: string) => void; + station: { + Station_JP: string; + StationNumber: string; + }; +}; +export const TrainPositionDataPush: FC = ({ + dialog, + setDialog, + currentTrainData, + stationInput, + stationNumberInput, + posInput, + descInput, + setPosInput, + setDescInput, + station, +}) => { + const sendPlatformData = () => { + fetch(`https://n8n.haruk.in/webhook/JR-shikoku-PosID`, { + method: "POST", + headers: { "Content-Type": "application/json" }, + body: JSON.stringify({ + PosId: currentTrainData?.PosNum, + lineName: currentTrainData?.Line, + PlatformNum: parseInt(posInput), + Description: descInput, + StationName: station.Station_JP, + StationId: station.StationNumber, + }), + }) + .then(() => { + alert("位置情報データを送信しました。"); + setDialog(false); + setPosInput(""); + setDescInput(""); + }) + .catch(() => { + alert("位置情報データの送信に失敗しました。"); + }); + }; + return ( + setDialog(false)}> + 路線: {currentTrainData?.Line} + 地点ID: {currentTrainData?.PosNum} + 駅名: {stationInput} + 駅ナンバー: {stationNumberInput} + + + + ); +}; diff --git a/components/発車時刻表/LED_vidion.js b/components/発車時刻表/LED_vidion.js index 51fa6e3..eca24ec 100644 --- a/components/発車時刻表/LED_vidion.js +++ b/components/発車時刻表/LED_vidion.js @@ -206,6 +206,7 @@ export default function LED_vision(props) { openStationACFromEachTrainInfo, }} station={station[0]} + key={d.train} /> ))} {areaString != "" && isInfoArea && (