コードの整理

This commit is contained in:
harukin-expo-dev-env 2024-12-06 09:48:26 +00:00
parent f60161b664
commit 139ce0ed7b
2 changed files with 43 additions and 24 deletions

View File

@ -6,30 +6,46 @@ type stateBox = {
title: string; title: string;
style?: ViewStyle; style?: ViewStyle;
mode?: number; mode?: number;
endText?: string;
}; };
export const StateBox: FC<stateBox> = ({ text, title, style, mode }) => ( export const StateBox: FC<stateBox> = (props) => {
<View style={{ ...(mode == 2 ? boxStyle2 : boxStyle), ...style }}> const { text, title, style, mode, endText } = props;
<Text style={{ fontSize: 12, color: "#0099CC" }}>{title}</Text> return (
<View style={{ flex: 1 }} /> <View style={{ ...(mode == 2 ? boxStyle2 : boxStyle), ...style }}>
<View style={{ flexDirection: mode == 2 ? "row" : "column" }}> <Text style={{ fontSize: 12, color: "#0099CC" }}>{title}</Text>
{text?.match("") ? ( <View style={{ flex: 1 }} />
<> <View style={{ flexDirection: mode == 2 ? "row" : "column" }}>
<Text style={mode == 2 ? boxTextStyle2 : boxTextStyle}> {text?.match("") ? (
{text.split("")[0]} <>
<Text style={mode == 2 ? boxTextStyle2 : boxTextStyle}>
{text.split("")[0]}
</Text>
<Text style={{ color: "#0099CC", textAlign: "right" }}>
{mode == 2 ? "→" : "↓"}
</Text>
<Text style={mode == 2 ? boxTextStyle2 : boxTextStyle}>
{text.split("")[1]}
</Text>
</>
) : (
<Text style={mode == 2 ? boxTextStyle2 : boxTextStyle}>{text}</Text>
)}
</View>
{endText && (
<View style={{ flexDirection: mode == 2 ? "row" : "column" }}>
<Text
style={{
...{ ...(mode == 2 ? boxTextStyle2 : boxTextStyle) },
fontSize: 10,
}}
>
{endText}
</Text> </Text>
<Text style={{ color: "#0099CC", textAlign: "right" }}> </View>
{mode == 2 ? "→" : "↓"}
</Text>
<Text style={mode == 2 ? boxTextStyle2 : boxTextStyle}>
{text.split("")[1]}
</Text>
</>
) : (
<Text style={mode == 2 ? boxTextStyle2 : boxTextStyle}>{text}</Text>
)} )}
</View> </View>
</View> );
); };
const boxStyle: ViewStyle = { const boxStyle: ViewStyle = {
flex: 1, flex: 1,
backgroundColor: "white", backgroundColor: "white",

View File

@ -19,7 +19,7 @@ export const TrainDataView = ({
const { isLandscape } = useDeviceOrientationChange(); const { isLandscape } = useDeviceOrientationChange();
const { inject } = useCurrentTrain(); const { inject } = useCurrentTrain();
const [mapsStationData, setMapsStationData] = useState(undefined); const [mapsStationData, setMapsStationData] = useState(undefined);
const [platformNumber, setPlatformNumber] = useState(); const [platformNumber, setPlatformNumber] = useState();
const [platformDescription, setPlatformDescription] = useState(); const [platformDescription, setPlatformDescription] = useState();
useEffect(() => { useEffect(() => {
@ -41,9 +41,11 @@ export const TrainDataView = ({
}, []); }, []);
const onLine = !!currentPosition?.toString().length; const onLine = !!currentPosition?.toString().length;
const trainPositionText = (trainData) => { const trainPositionText = (trainData) => {
const { isBetween, Pos } = trainPosition(trainData); const { isBetween, Pos: PosData } = trainPosition(trainData);
if (isBetween === true) return `${Pos.from}${Pos.to}`; const { from, to, Pos } = PosData;
else return Pos.Pos == "" ? "" : `${Pos.Pos}${platformNumber ? ` ${platformNumber}番線`:""}${platformDescription ? `\n${platformNumber}番線`:""}`; if (isBetween === true) return `${from}${to}`;
if (Pos == "") return "";
return `${Pos}${platformNumber ? ` ${platformNumber}番線` : ""}`;
}; };
return ( return (
<View <View
@ -84,6 +86,7 @@ export const TrainDataView = ({
mode={mode} mode={mode}
title={`現在地 ${currentPosition?.toString()}${onLine ? "▶️" : ""}`} title={`現在地 ${currentPosition?.toString()}${onLine ? "▶️" : ""}`}
text={trainPositionText(currentTrainData)} text={trainPositionText(currentTrainData)}
endText={platformDescription ? `${platformDescription}` : ""}
style={ style={
onLine onLine
? { borderWidth: 1, borderColor: "red", borderStyle: "solid" } ? { borderWidth: 1, borderColor: "red", borderStyle: "solid" }