diff --git a/src/pages/Measure.tsx b/src/pages/Measure.tsx index f752c5e..15aa904 100644 --- a/src/pages/Measure.tsx +++ b/src/pages/Measure.tsx @@ -1,43 +1,68 @@ import StepItem, { StepName, StepState } from '../components/StepItem'; -import { Link, useNavigate } from 'react-router-dom'; +import { useNavigate } from 'react-router-dom'; import CustomNavBar from '../components/CustomNavBar'; import MeasurementCanvas, { BenchmarkShape, MeasurementCanvasRef, } from '../components/konva/MeasurementCanvas'; import { useEffect, useRef, useState } from 'react'; -import { rail6001, railTypes } from '../utils/constant'; import RailTypeBtn from '../components/RailTypeBtn'; import { Cascader, Picker, Toast } from 'antd-mobile'; import { useAppDispatch, useAppSelector } from '../utils/hooks'; import { updateTaskState } from '../store/features/measureSlice'; import Bridge from '../utils/bridge'; -import { selectLabeledKtjOrgs } from '../store/features/baseData'; +import { selectLabeledKtjOrgs, updateRailPoints } from '../store/features/baseData'; import { updateOrg } from '../store/features/contextSlice'; import { textsOfKeys } from '../utils/helper'; - export default function Measure() { const navigate = useNavigate(); const dispatch = useAppDispatch(); const labeledKtjOrgs = useAppSelector((state) => selectLabeledKtjOrgs(state.baseData)); const measureState = useAppSelector((state) => state.measure); const contextState = useAppSelector((state) => state.context); + const baseState = useAppSelector((state) => state.baseData); const canvasRef = useRef(null); const [railPickerVisible, setRailPickerVisible] = useState(false); - const [railId, setRailId] = useState<(number | string | null)[]>([1]); + const [railId, setRailId] = useState<(number | string | null)[]>([]); - // 绘制轨型基准线 + // 默认选中第一个轨型 useEffect(() => { - const benchmarkShapes = JSON.parse(rail6001.points) as BenchmarkShape[]; + if (baseState.railTypes.length > 0) { + setRailId([baseState.railTypes[0].id]); + } + }, [baseState.railTypes]); + + function drawRailBaseLine(points: string) { + const benchmarkShapes = JSON.parse(points) as BenchmarkShape[]; if (canvasRef.current) { canvasRef.current.setBenchmarkData(benchmarkShapes); } - }, []); + } + + // 检查轨型有没有坐标,如果有,绘制轨型基准线,如果没,拉取再绘制其线 + useEffect(() => { + if (railId.length > 0) { + const r = baseState.railTypes.find((rail) => rail.id === railId[0]); + if (!r) return; + if (!!r.points) { + drawRailBaseLine(r.points); + return; + } + Bridge.getTrackPoint({ code: r.code }).then((res) => { + if (res.success) { + dispatch(updateRailPoints(res.data)); + drawRailBaseLine(res.data.points!); + } else { + Toast.show(res.message); + } + }); + } + }, [baseState.railTypes, dispatch, railId]); // 绘制测量坐标线 useEffect(() => { @@ -133,7 +158,7 @@ export default function Measure() { } function railName() { - return railTypes.find((r) => r.id === railId[0])?.name || ''; + return baseState.railTypes.find((r) => r.id === railId[0])?.name || ''; } return ( @@ -162,9 +187,12 @@ export default function Measure() { showCoordinates={false} ref={canvasRef} /> -
- setRailPickerVisible(true)} /> -
+ + {railId.length > 0 && ( +
+ setRailPickerVisible(true)} /> +
+ )} @@ -199,7 +227,7 @@ export default function Measure() { ({ ...t, label: t.name, value: t.id }))]} + columns={[baseState.railTypes.map((t) => ({ ...t, label: t.name, value: t.id }))]} visible={railPickerVisible} onClose={() => { setRailPickerVisible(false); diff --git a/src/pages/MeasureSave.tsx b/src/pages/MeasureSave.tsx index 9ce4935..e48c8a1 100644 --- a/src/pages/MeasureSave.tsx +++ b/src/pages/MeasureSave.tsx @@ -1,13 +1,16 @@ import { NavBar, Picker } from 'antd-mobile'; import { useNavigate } from 'react-router'; import icon_arr_r from '../assets/icon_arr_s_r.svg'; -import { railTypes } from '../utils/constant'; +// import { railTypes } from '../utils/constant'; import { ChangeEvent, useState } from 'react'; +import { useAppSelector } from '../utils/hooks'; export default function MeasureSave() { const navigate = useNavigate(); const back = () => navigate(-1); + const baseState = useAppSelector(state => state.baseData); + const [name, setName] = useState("") const [railPickerVisible, setRailPickerVisible] = useState(false); const [railId, setRailId] = useState<(number | string | null)[]>([1]); @@ -40,7 +43,7 @@ export default function MeasureSave() {
setRailPickerVisible(true)}> 轨型 - {railTypes.find((r) => r.id === railId[0])?.name || ''} + {baseState.railTypes.find((r) => r.id === railId[0])?.name || ''} arr
@@ -54,7 +57,7 @@ export default function MeasureSave() { ({ ...t, label: t.name, value: t.id }))]} + columns={[baseState.railTypes.map((t) => ({ ...t, label: t.name, value: t.id }))]} visible={railPickerVisible} onClose={() => { setRailPickerVisible(false); diff --git a/src/services/apiTypes.ts b/src/services/apiTypes.ts index bdec02a..b833647 100644 --- a/src/services/apiTypes.ts +++ b/src/services/apiTypes.ts @@ -25,3 +25,11 @@ export type KTJOrg = { }>; }>; }; + +export type RailType = { + id: number; + name: string; + code: string; + calPoints?: string; + points?: string; +} diff --git a/src/store/features/baseData.ts b/src/store/features/baseData.ts index ecf5193..03cf484 100644 --- a/src/store/features/baseData.ts +++ b/src/store/features/baseData.ts @@ -1,26 +1,51 @@ -import { createSelector, createSlice } from "@reduxjs/toolkit"; -import { KTJOrg } from "../../services/apiTypes"; -import { labeledKtjOrgs } from "../../utils/helper"; +import { createAsyncThunk, createSelector, createSlice, PayloadAction } from '@reduxjs/toolkit'; +import { KTJOrg, RailType } from '../../services/apiTypes'; +import { labeledKtjOrgs } from '../../utils/helper'; -import { ktjOrgs } from "../../utils/constant"; +import { ktjOrgs } from '../../utils/constant'; +import Bridge from '../../utils/bridge'; interface BaseDataState { - ktjOrgs: KTJOrg[]; + ktjOrgs: KTJOrg[]; + railTypes: RailType[]; } const initialState: BaseDataState = { - ktjOrgs: ktjOrgs as KTJOrg[], -} + ktjOrgs: ktjOrgs as KTJOrg[], + railTypes: [], +}; + +export const fetchRailTypes = createAsyncThunk('base/fetchRailTypes', async (_, thunkAPI) => { + const res = await Bridge.getBasicTrackList(); + return res.success ? res.data : null; +}); export const baseDataSlice = createSlice({ - name: 'baseData', - initialState, - reducers: {} + name: 'baseData', + initialState, + reducers: { + updateRailTypes: (state, action: PayloadAction) => { + state.railTypes = action.payload; + }, + updateRailPoints: (state, action: PayloadAction) => { + const r = state.railTypes.find((r) => r.code === action.payload.code); + if (r) { + r.points = action.payload.points; + r.calPoints = action.payload.calPoints; + } + }, + }, + extraReducers: (builder) => { + builder.addCase(fetchRailTypes.fulfilled, (state, action) => { + state.railTypes = action.payload || []; + }); + }, }); +export const { updateRailPoints } = baseDataSlice.actions; export default baseDataSlice.reducer; -export const selectKtjOrgs = (state: BaseDataState) => state.ktjOrgs -export const selectLabeledKtjOrgs = createSelector(selectKtjOrgs,(orgs) => { - return labeledKtjOrgs(orgs) -}) +export const selectKtjOrgs = (state: BaseDataState) => state.ktjOrgs; +export const selectLabeledKtjOrgs = createSelector(selectKtjOrgs, (orgs) => { + return labeledKtjOrgs(orgs); +}); diff --git a/src/utils/bridge.ts b/src/utils/bridge.ts index e909715..a253f46 100644 --- a/src/utils/bridge.ts +++ b/src/utils/bridge.ts @@ -1,6 +1,6 @@ import { Subject } from 'rxjs'; import httpRequest from '../services/httpRequest'; -import { Measurement } from '../services/apiTypes'; +import { Measurement, RailType } from '../services/apiTypes'; import { MobileDatagram, SyncProgress } from '../services/mobileWsType'; declare global { @@ -214,7 +214,7 @@ export default class Bridge { params: {}, }); } - static connectPeripheral(params: { id: string }) { + static connectPeripheral(params: { mac: string }) { return httpRequest({ url: '/api/ble/connect', method: 'POST', @@ -314,4 +314,18 @@ export default class Bridge { params, }); } + static getBasicTrackList() { + return httpRequest>({ + url: '/api/basic/track-list', + method: 'POST', + params: {}, + }); + } + static getTrackPoint(params: { code: string }) { + return httpRequest>({ + url: '/api/basic/track/get-by-code', + method: 'POST', + params, + }); + } } diff --git a/src/utils/constant.ts b/src/utils/constant.ts index 457dfcf..51e31d8 100644 --- a/src/utils/constant.ts +++ b/src/utils/constant.ts @@ -1653,25 +1653,25 @@ export const ktjOrgs = [ }, ]; -export const railTypes = [ - { - id: 1, - code: '1', - name: '60轨', - }, - { - id: 2, - code: '2', - name: '60N轨', - }, - { - id: 3, - code: '3', - name: '50轨', - }, - { - id: 4, - code: '4', - name: '43轨', - }, -]; +// export const railTypes = [ +// { +// id: 1, +// code: '1', +// name: '60轨', +// }, +// { +// id: 2, +// code: '2', +// name: '60N轨', +// }, +// { +// id: 3, +// code: '3', +// name: '50轨', +// }, +// { +// id: 4, +// code: '4', +// name: '43轨', +// }, +// ];