項目の最適化

components/ActionSheetComponents/EachTrainInfo/TrainDataView.js

@@ -38,7 +38,14 @@ export const TrainDataView = ({
       .then((res) => res.json())
       .then((data) => {
         if (!data) return;
-        const {type, stationName, lineNumber, platformNumber, position, description} = data;
+        const {
+          type,
+          stationName,
+          lineNumber,
+          platformNumber,
+          position,
+          description,
+        } = data;
         if (type == "Station") {
           setLineNumber(lineNumber);
           setPlatformNumber(platformNumber);
@@ -55,10 +62,8 @@ export const TrainDataView = ({
   }, []);
   const onLine = !!currentPosition?.toString().length;
   const [dialog, setDialog] = useState(false);
-  const [deleteDialog, setDeleteDialog] = useState(false);
   const [posInput, setPosInput] = useState("");
   const [descInput, setDescInput] = useState("");
-  const [stationInput, setStationInput] = useState("");
   const [stationNumberInput, setStationNumberInput] = useState("");
   const [lineInput, setLineInput] = useState("");
   return (
@@ -67,18 +72,13 @@ export const TrainDataView = ({
         dialog={dialog}
         setDialog={setDialog}
         currentTrainData={currentTrainData}
-        stationInput={stationInput}
         stationNumberInput={stationNumberInput}
-        posInput={posInput}
-        descInput={descInput}
-        setPosInput={setPosInput}
-        setDescInput={setDescInput}
         lineInput={lineInput}
         setLineInput={setLineInput}
-        station={{
+        posInput={posInput}
-          Station_JP: currentTrainData?.Pos,
+        setPosInput={setPosInput}
-          StationNumber: currentPosition[0],
+        descInput={descInput}
-        }}
+        setDescInput={setDescInput}
       />
       <View
         style={{
@@ -100,15 +100,12 @@ export const TrainDataView = ({
                 platformDescription == undefined
               )
                 return;
-              setStationInput(`${Pos.from}→${Pos.to}間`);
               setStationNumberInput(
                 getStationID(currentTrainData?.Pos, stationList)
               );
               setPosInput(platformNumber?.toString() || "");
               setLineInput(lineNumber?.toString() || "");
-              setDeleteDialog(true);
             } else {
-              setStationInput(Pos.Pos);
               setStationNumberInput(
                 getStationID(currentTrainData?.Pos, stationList)
               );
@@ -147,7 +144,7 @@ export const TrainDataView = ({
             currentTrainData={currentTrainData}
             platformNumber={platformNumber}
             lineNumber={lineNumber}
-            platformDescription={platformDescription ? `${platformDescription}` : ""}
+            platformDescription={platformDescription || ""}
             style={
               onLine
                 ? { borderWidth: 1, borderColor: "red", borderStyle: "solid" }

components/発車時刻表/EachData.tsx

@@ -1,6 +1,5 @@
 import React, { FC, useEffect, useState } from "react";
-import { Linking, TouchableOpacity, Text } from "react-native";
+import { TouchableOpacity } from "react-native";
-import { Dialog, Button, Input } from "react-native-elements";
 import { checkDuplicateTrainData } from "../../lib/checkDuplicateTrainData";
 import { getTrainDelayStatus } from "../../lib/getTrainDelayStatus";
 import { getTrainType } from "../../lib/getTrainType";
@@ -158,15 +157,13 @@ export const EachData: FC<Props> = (props) => {
         setDialog={setDialog}
         {...{
           currentTrainData,
-          stationInput,
           stationNumberInput,
-          posInput,
-          descInput,
-          setPosInput,
-          setDescInput,
-          station,
           lineInput,
           setLineInput,
+          posInput,
+          setPosInput,
+          descInput,
+          setDescInput
         }}
       />
       <TouchableOpacity
@@ -218,6 +215,8 @@ export const EachData: FC<Props> = (props) => {
           setPlatformNumber={setPlatformNumber}
           platformDescription={platformDescription}
           platformNumber={platformNumber}
+          lineInput={lineInput}
+          setLineInput={setLineInput}
           key={d.train + "-trainPosition"}
         />
       )}

components/発車時刻表/LED_inside_Component/TrainPosition.tsx

@@ -1,4 +1,4 @@
-import React, { FC, useEffect } from "react";
+import React, { FC, useEffect, useState } from "react";
 import { Text, TextStyle, View, TouchableOpacity } from "react-native";
 import { useStationList } from "../../../stateBox/useStationList";
 import {
@@ -24,9 +24,11 @@ type Props = {
   setDialog: (dialog: boolean) => void;
   setDeleteDialog: (dialog: boolean) => void;
   platformDescription: string;
-  platformNumber: number;
+  platformNumber: string;
   setPlatformDescription: (desc: string) => void;
-  setPlatformNumber: (num: number) => void;
+  setPlatformNumber: (num: string) => void;
+  lineInput: string;
+  setLineInput: (line: string) => void;
 };
 
 export const TrainPosition: FC<Props> = ({
@@ -43,27 +45,55 @@ export const TrainPosition: FC<Props> = ({
   setPlatformNumber,
   platformDescription,
   platformNumber,
+  setLineInput,
 }) => {
-  const { currentTrain } = useCurrentTrain();
   const { stationList } = useStationList();
-
+  type data = {
+    type: string;
+    lineNumber: string;
+    platformNumber: string;
+    position: string;
+    stationName: string;
+    description: string;
+  };
+  const [database, setDatabase] = useState<data>(null);
+  const [text, setText] = useState("");
+  const [masterText, setMasterText] = useState("");
+  useEffect(() => {
+    const text = `${currentTrainData?.PosNum} ${currentTrainData?.Line} ${currentTrainData?.Pos}`;
+    setText(trainIDSwitch ? text : masterText);
+    return () => {
+      setText("");
+    };
+  }, [masterText, trainIDSwitch]);
   useEffect(() => {
     fetch(
       `https://n8n.haruk.in/webhook/JR-shikoku-PosID-v3?PosId=${currentTrainData?.PosNum}&lineName=${currentTrainData?.Line}&StationName=${currentTrainData?.Pos}`
     )
       .then((res) => res.json())
-      .then((data: { type: string; platform: number; description: string }) => {
+      .then((data: data) => {
-        const { type, platform, description } = data;
+        const { type, platformNumber, description, lineNumber } = data;
-        setPlatformNumber(type == "Station" ? platform : undefined);
+        setDatabase(data);
-        setPlatformDescription(type == "Station" ? description : undefined);
+        const { isBetween, Pos } = trainPosition(currentTrainData);
+        if (isBetween === true) {
+          // 移動中
+          setMasterText(`現在地：${Pos.from}→${Pos.to}間を走行中`);
+        } else {
+          if (Pos.Pos) {
+            let platform = platformNumber ? `${platformNumber}番乗り場` : "";
+            let line = lineNumber ? `${lineNumber}番線` : "";
+            setMasterText(
+              `現在地：${Pos.Pos}  ${platform || line} ${description || ""}`
+            );
+          } else {
+            setMasterText("");
+          }
+        }
       });
-  }, [currentTrainData, currentTrain]);
+    return () => {
-
+      setMasterText("");
-  const trainPositionText = (trainData: trainDataType) => {
-    const { isBetween, Pos } = trainPosition(trainData);
-    if (isBetween === true) return `現在地：${Pos.from}→${Pos.to}間を走行中`;
-    else return Pos.Pos == "" ? "" : `現在地：${Pos.Pos}`;
     };
+  }, [currentTrainData?.PosNum, currentTrainData?.Line, currentTrainData?.Pos]);
 
   return (
     <TouchableOpacity
@@ -79,22 +109,18 @@ export const TrainPosition: FC<Props> = ({
       }}
       onLongPress={() => {
         const { isBetween, Pos } = trainPosition(currentTrainData);
+        setStationNumberInput(getStationID(currentTrainData?.Pos, stationList));
+        setPosInput(database?.platformNumber?.toString() || "");
         if (isBetween === true) {
-          if (platformNumber == undefined && platformDescription == undefined)
+          if (database?.platformNumber == undefined && database?.description == undefined)
             return;
           setStationInput(`${Pos.from}→${Pos.to}間`);
-          setStationNumberInput(
-            getStationID(currentTrainData?.Pos, stationList)
-          );
-          setPosInput(platformNumber?.toString() || "");
           setDeleteDialog(true);
         } else {
-          setStationInput(Pos.Pos);
+          setStationInput(currentTrainData?.Pos);
-          setStationNumberInput(
+          setDescInput(database?.description || "");
-            getStationID(currentTrainData?.Pos, stationList)
+          setLineInput(database?.lineNumber?.toString() || "");
-          );
+          setPlatformNumber(database?.platformNumber?.toString() || "");
-          setDescInput(platformDescription || "");
-          setPosInput(platformNumber?.toString() || "");
           setDialog(true);
         }
       }}
@@ -104,13 +130,7 @@ export const TrainPosition: FC<Props> = ({
           style={{ ...descriptionStyle, color: "green" }}
           numberOfLines={numberOfLines}
         >
-          {`${
+          {text}
-            trainIDSwitch
-              ? currentTrainData?.PosNum + currentTrainData?.Line
-              : trainPositionText(currentTrainData)
-          } ${platformNumber ? platformNumber + "番線" : ""} ${
-            platformDescription ? "(" + platformDescription + ")" : ""
-          }`}
         </Text>
       </View>
     </TouchableOpacity>

components/発車時刻表/LED_inside_Component/TrainPositionDataPush.tsx

@@ -1,13 +1,13 @@
-import React, { FC, useState } from "react";
+import React, { FC } 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";
+import { getStationID } from "@/lib/eachTrainInfoCoreLib/getStationData";
+import { useStationList } from "@/stateBox/useStationList";
 type Props = {
   dialog: boolean;
   setDialog: (dialog: boolean) => void;
   currentTrainData: trainDataType;
-  stationInput: string;
   stationNumberInput: string;
   posInput: string;
   descInput: string;
@@ -15,37 +15,33 @@ type Props = {
   setPosInput: (pos: string) => void;
   setDescInput: (desc: string) => void;
   setLineInput: (line: string) => void;
-  station: {
+
-    Station_JP: string;
-    StationNumber: string;
-  };
 };
 export const TrainPositionDataPush: FC<Props> = ({
   dialog,
   setDialog,
   currentTrainData,
-  stationInput,
   stationNumberInput,
   lineInput,
   setLineInput,
   posInput,
-  descInput,
   setPosInput,
+  descInput,
   setDescInput,
-  station,
 }) => {
+  const { stationList } = useStationList();
   const sendPlatformData = () => {
     fetch(`https://n8n.haruk.in/webhook/JR-shikoku-PosID-v3`, {
       method: "POST",
       headers: { "Content-Type": "application/json" },
       body: JSON.stringify({
-        PosId: currentTrainData?.PosNum,//自動：位置情報ID
+        PosId: currentTrainData?.PosNum, //自動：位置情報ID
-        StationId: station.StationNumber,//自動：駅ID
+        StationId: getStationID(currentTrainData?.Pos, stationList), //自動：駅ID
-        StationName: station.Station_JP,//自動：駅名、漢字
+        StationName: currentTrainData?.Pos, //自動：駅名、漢字
-        lineName: currentTrainData?.Line,//自動：位置情報路線ID(koutoku/yosan)
+        lineName: currentTrainData?.Line, //自動：位置情報路線ID(koutoku/yosan)
-        Description: descInput,//手動入力、参考情報
+        Description: descInput, //手動入力、参考情報
-        platformNumber: parseInt(posInput),//手動入力、乗り場表記
+        platformNumber: parseInt(posInput), //手動入力、乗り場表記
-        lineNumber: parseInt(lineInput),//手動入力、番線表記
+        lineNumber: parseInt(lineInput), //手動入力、番線表記
       }),
     })
       .then(() => {
@@ -60,9 +56,10 @@ export const TrainPositionDataPush: FC<Props> = ({
   };
   return (
     <Dialog isVisible={dialog} onBackdropPress={() => setDialog(false)}>
+      <Text style={{ fontSize: 20, fontWeight: "bold" }}>駅番線情報投稿機能</Text>
       <Text>路線: {currentTrainData?.Line}</Text>
       <Text>地点ID: {currentTrainData?.PosNum}</Text>
-      <Text>駅名: {stationInput}</Text>
+      <Text>駅名: {currentTrainData?.Pos}</Text>
       <Text>駅ナンバー: {stationNumberInput}</Text>
       <Input
         label="乗り場"
@@ -82,6 +79,7 @@ export const TrainPositionDataPush: FC<Props> = ({
         value={descInput}
         onChangeText={setDescInput}
       />
+      <Text style={{ fontSize: 12, fontWeight: "bold" }}>この機能は駅の停車位置に関する情報を投稿する機能です。列車の遅れ、運行情報を投稿するフォームではありませんのでご注意ください。</Text>
       <Button title="送信" onPress={sendPlatformData} />
     </Dialog>
   );