Browse Source

拆分测量记录和上传记录

master
zhangjiming 4 months ago
parent
commit
0e04d1b0ac
  1. 2
      src/App.tsx
  2. 10
      src/index.tsx
  3. 84
      src/pages/MeasurementList.tsx
  4. 143
      src/pages/Mine2.tsx
  5. 65
      src/pages/UploadList.tsx
  6. 32
      src/utils/bridge.ts
  7. 282
      src/utils/constant.ts

2
src/App.tsx

@ -29,7 +29,7 @@ const BottomBar = () => {
const tabs = [ const tabs = [
{ {
key: '/home/measure', key: '/home/measure',
title: '首页',
title: '测量',
icon_s: icon_1_s, icon_s: icon_1_s,
icon_n: icon_1_u, icon_n: icon_1_u,
}, },

10
src/index.tsx

@ -20,6 +20,8 @@ import Mine from './pages/Mine';
import Mine2 from './pages/Mine2'; import Mine2 from './pages/Mine2';
import MeasureSave from './pages/MeasureSave'; import MeasureSave from './pages/MeasureSave';
import MeasureRecord from './pages/MeasureRecord'; import MeasureRecord from './pages/MeasureRecord';
import MeasurementList from './pages/MeasurementList';
import UploadList from './pages/UploadList';
const router = createHashRouter( const router = createHashRouter(
createRoutesFromElements( createRoutesFromElements(
@ -33,6 +35,8 @@ const router = createHashRouter(
</Route> </Route>
<Route path="measure"> <Route path="measure">
<Route path="save" element={<MeasureSave />}></Route> <Route path="save" element={<MeasureSave />}></Route>
<Route path="records" element={<MeasurementList />} />
<Route path="upload" element={<UploadList />} />
<Route path="record/:recordId" element={<MeasureRecord />}></Route> <Route path="record/:recordId" element={<MeasureRecord />}></Route>
</Route> </Route>
</Route> </Route>
@ -42,9 +46,9 @@ const router = createHashRouter(
const root = ReactDOM.createRoot(document.getElementById('root') as HTMLElement); const root = ReactDOM.createRoot(document.getElementById('root') as HTMLElement);
root.render( root.render(
// <React.StrictMode> // <React.StrictMode>
<Provider store={store}>
<RouterProvider router={router} />
</Provider>
<Provider store={store}>
<RouterProvider router={router} />
</Provider>
// </React.StrictMode> // </React.StrictMode>
); );

84
src/pages/MeasurementList.tsx

@ -0,0 +1,84 @@
import { NavBar } from 'antd-mobile';
import { useNavigate } from 'react-router-dom';
import MeasureGroups from '../components/MeasureGroups';
import { useState } from 'react';
import { Measurement } from '../services/apiTypes';
import * as R from 'ramda';
import { MoreOutline, UploadOutline } from 'antd-mobile-icons';
import { dataList } from '../utils/constant';
const PAGE_SIZE = 10;
export default function MeasurementList() {
const navigate = useNavigate();
const [editMode, setEditMode] = useState(false);
const [selectedIds, setSelectedIds] = useState<number[]>([]);
async function loadMoreRecords() {}
const onItemSelect = (groupIdx: number, id: number) => {
if (selectedIds.includes(id)) {
setSelectedIds(R.reject((item) => item === id, selectedIds));
} else {
setSelectedIds([...selectedIds, id]);
}
};
const onGroupSelect = (groupIdx: number) => {
const ids = dataList[groupIdx].list.map((item) => item.id);
if (R.intersection(selectedIds, ids).length === ids.length) {
setSelectedIds(R.difference(selectedIds, ids));
} else {
setSelectedIds(R.union(selectedIds, ids));
}
};
const onUploadClick = () => {
navigate("/measure/upload")
}
const right = (
<div
className="flex justify-end gap-x-2"
style={{ fontSize: 24 }}
>
<UploadOutline onClick={() => navigate("/measure/upload")} />
<MoreOutline onClick={() => setEditMode(!editMode)}/>
</div>
);
const back = () => navigate(-1);
return (
<div>
<NavBar className="bg-white" onBack={back} right={right}>
</NavBar>
<div
className="main-page-content overflow-x-hidden overflow-y-auto relative"
style={{ paddingBottom: editMode ? '48px' : 0 }}
>
<MeasureGroups
dataList={dataList}
editMode={editMode}
hasMore={false}
loadMore={loadMoreRecords}
onItemSelect={onItemSelect}
onGroupSelect={onGroupSelect}
selectedIds={selectedIds}
/>
<footer
className="fixed -bottom-12 w-full h-12 bg-white flex px-5 py-2 gap-x-4"
style={{ bottom: editMode ? 0 : '-48px', transition: 'bottom 300ms' }}
>
<button disabled={selectedIds.length === 0} className="btn-contained rounded-md flex-1" onClick={onUploadClick}>
</button>
<button disabled={selectedIds.length === 0} className="btn-contained rounded-md flex-1">
</button>
</footer>
</div>
</div>
);
}

143
src/pages/Mine2.tsx

@ -1,138 +1,25 @@
import { NavBar, Toast } from 'antd-mobile';
import { useEffect, useRef, useState } from 'react';
import { Measurement } from '../services/apiTypes';
import Bridge from '../utils/bridge';
import MeasureGroups from '../components/MeasureGroups';
import { MoreOutline } from 'antd-mobile-icons';
import * as R from 'ramda';
import { List, NavBar } from 'antd-mobile';
const PAGE_SIZE = 10;
const dataList: Array<{ groupName: string; list: Measurement[] }> = [
{
groupName: '2025-03-02',
list: [
{
id: 1,
name: '测量名称1',
createAt: '2025-03-02 10:20',
line: '京沪线',
section: 'A段',
direction: '上行',
railId: 2,
leftPoints: '[]',
rightPoints: '[]',
bureau: '北京铁路局',
upload: false,
},
{
id: 2,
name: '测量名称2',
createAt: '2025-03-02 12:22',
line: '京沪线',
section: 'B段',
direction: '下行',
railId: 2,
leftPoints: '[]',
rightPoints: '[]',
bureau: '北京铁路局',
upload: false,
},
{
id: 3,
name: '测量名称3',
createAt: '2025-03-02 12:20',
line: '京沪线',
section: 'C段',
direction: '上行',
railId: 2,
leftPoints: '[]',
rightPoints: '[]',
bureau: '北京铁路局',
upload: false,
},
],
},
{
groupName: '2025-02-01',
list: [
{
id: 4,
name: '测量名称2',
createAt: '2025-03-02 10:20',
line: '京沪线',
section: 'D段',
direction: '下行',
railId: 2,
leftPoints: '[]',
rightPoints: '[]',
bureau: '北京铁路局',
upload: false,
},
{
id: 5,
name: '测量名称2',
createAt: '2025-03-02 10:20',
line: '京沪线',
section: 'E段',
direction: '下行',
railId: 2,
leftPoints: '[]',
rightPoints: '[]',
bureau: '北京铁路局',
upload: false,
},
],
},
];
import { UnorderedListOutline, SetOutline } from 'antd-mobile-icons';
import { useNavigate } from 'react-router-dom';
export default function Mine2() { export default function Mine2() {
const [editMode, setEditMode] = useState(false);
const [selectedIds, setSelectedIds] = useState<number[]>([]);
async function loadMoreRecords() {}
const onItemSelect = (groupIdx: number, id: number) => {
if (selectedIds.includes(id)) {
setSelectedIds(R.reject((item) => item === id, selectedIds));
} else {
setSelectedIds([...selectedIds, id]);
}
};
const onGroupSelect = (groupIdx: number) => {
const ids = dataList[groupIdx].list.map((item) => item.id);
if (R.intersection(selectedIds, ids).length === ids.length) {
setSelectedIds(R.difference(selectedIds, ids));
} else {
setSelectedIds(R.union(selectedIds, ids));
}
};
const right = (
<div
onClick={() => setEditMode(!editMode)}
className="flex justify-end"
style={{ fontSize: 24 }}
>
<MoreOutline />
</div>
);
const navigate = useNavigate();
return ( return (
<div> <div>
<NavBar className="bg-white" back={null} right={right}>
<NavBar className="bg-white" back={null}>
</NavBar> </NavBar>
<div className="home-page-content overflow-x-hidden overflow-y-auto">
<MeasureGroups
dataList={dataList}
editMode={editMode}
hasMore={false}
loadMore={loadMoreRecords}
onItemSelect={onItemSelect}
onGroupSelect={onGroupSelect}
selectedIds={selectedIds}
/>
<div className="home-page-content overflow-x-hidden overflow-y-auto pt-3">
<List>
<List.Item prefix={<UnorderedListOutline />} onClick={() => navigate('/measure/records')}>
</List.Item>
<List.Item prefix={<SetOutline />} onClick={() => {}}>
</List.Item>
</List>
</div> </div>
</div> </div>
); );

65
src/pages/UploadList.tsx

@ -0,0 +1,65 @@
import { ActionSheet, InfiniteScroll, List, NavBar, Popup } from 'antd-mobile';
import { useNavigate } from 'react-router-dom';
import { MoreOutline } from 'antd-mobile-icons';
import { useState } from 'react';
import { dataListFlat } from '../utils/constant';
import MeasureGroups from '../components/MeasureGroups';
import MeasureItem from '../components/MeasureItem';
export default function UploadList() {
const navigate = useNavigate();
const [showMenu, setShowMenu] = useState(false);
const actions = [
{ text: '重试失败任务', key: 'retry' },
{ text: '清空列表', key: 'clear' },
{ text: '清空已完成任务', key: 'clearCompleted' },
]
const back = () => navigate(-1);
const right = (
<div
onClick={() => setShowMenu(!showMenu)}
className="flex justify-end gap-x-2"
style={{ fontSize: 24 }}
>
<MoreOutline />
</div>
);
return (
<div>
<NavBar className="bg-white" onBack={back} right={right}>
</NavBar>
<div className="main-page-content">
<header className="h-8 bg-[#EEE] flex items-center px-4">
<span>10</span>
<i className="border-l border-[#999] h-3 mx-2" />
<span>0</span>
<p className="ml-auto text-primary"></p>
</header>
<main className=" overflow-x-hidden overflow-y-auto">
<List>
{dataListFlat.map((item) => (
<List.Item key={item.id}>
<MeasureItem item={item} onDetail={() => navigate(`/measure/record/${item.id}`)} />
</List.Item>
))}
{/* <InfiniteScroll loadMore={loadMore} hasMore={hasMore} /> */}
</List>
</main>
</div>
<ActionSheet
visible={showMenu}
actions={actions}
onClose={() => setShowMenu(false)}
/>
</div>
);
}

32
src/utils/bridge.ts

@ -161,7 +161,7 @@ export default class Bridge {
return httpRequest<BridgeBaseResult<Measurement[]>>({ return httpRequest<BridgeBaseResult<Measurement[]>>({
url: '/api/mobile/getUploadedRecords', url: '/api/mobile/getUploadedRecords',
method: 'GET', method: 'GET',
params: param
params: param,
}); });
} }
} }
@ -176,7 +176,7 @@ export default class Bridge {
return httpRequest<BridgeBaseResult<Measurement[]>>({ return httpRequest<BridgeBaseResult<Measurement[]>>({
url: '/api/mobile/getUnuploadRecords', url: '/api/mobile/getUnuploadRecords',
method: 'GET', method: 'GET',
params: param
params: param,
}); });
} }
} }
@ -191,7 +191,7 @@ export default class Bridge {
return httpRequest<BridgeBaseResult<Measurement[]>>({ return httpRequest<BridgeBaseResult<Measurement[]>>({
url: '/api/mobile/searchHistoryRecords', url: '/api/mobile/searchHistoryRecords',
method: 'GET', method: 'GET',
params: param
params: param,
}); });
} }
} }
@ -206,23 +206,23 @@ export default class Bridge {
return httpRequest<BridgeBaseResult<Measurement>>({ return httpRequest<BridgeBaseResult<Measurement>>({
url: '/api/mobile/getMeasurementDetail', url: '/api/mobile/getMeasurementDetail',
method: 'GET', method: 'GET',
params: param
params: param,
}); });
} }
} }
static uploadRecords(param: {ids: number[]}) {
static uploadRecords(param: { ids: number[] }) {
if (appWebview) { if (appWebview) {
return new Promise<BridgeBaseResult>((resolve) => {
const res = window.SyncBridgeJS.call('uploadRecords', JSON.stringify(param));
resolve(JSON.parse(res));
});
} else {
return httpRequest<BridgeBaseResult>({
url: '/api/mobile/uploadRecords',
method: 'POST',
params: param
});
}
return new Promise<BridgeBaseResult>((resolve) => {
const res = window.SyncBridgeJS.call('uploadRecords', JSON.stringify(param));
resolve(JSON.parse(res));
});
} else {
return httpRequest<BridgeBaseResult>({
url: '/api/mobile/uploadRecords',
method: 'POST',
params: param,
});
}
} }
} }

282
src/utils/constant.ts

@ -1,89 +1,213 @@
import { Measurement } from '../services/apiTypes';
export const rail6001 = { export const rail6001 = {
id: 1,
createTime: "2025-03-03 12:31:25",
updateTime: "2025-03-03 12:31:25",
name: "60型标准轨",
code: "6001",
points: "[{\"type\":\"arc\",\"start\": {\"x\": 0,\"y\": 0},\"end\": {\"x\": -9.949,\"y\": 0.165},\"radius\": 300,\"color\":\"#000000\",\"side\":\"right\"},{\"type\":\"arc\",\"start\": {\"x\": -9.949,\"y\": 0.165},\"end\": {\"x\": -25.35,\"y\": 2.185},\"radius\": 80,\"color\":\"#000000\",\"side\":\"right\"},{\"type\":\"arc\",\"start\": {\"x\": -25.35,\"y\": 2.185},\"end\": {\"x\": -35.4,\"y\": 14.2},\"radius\": 13,\"color\":\"#000000\",\"side\":\"right\"},{\"type\":\"line\",\"start\": {\"x\": -35.4,\"y\": 14.2},\"end\": {\"x\": -36.317,\"y\": 32.539},\"color\":\"#000000\"},{\"type\":\"arc\",\"start\": {\"x\": -36.317,\"y\": 32.539},\"end\": {\"x\": -32.904,\"y\": 37.532},\"radius\": 5,\"color\":\"#000000\",\"side\":\"right\"},{\"type\":\"line\",\"start\": {\"x\": -32.904,\"y\": 37.532},\"end\": {\"x\": -20,\"y\": 41.833},\"color\":\"#000000\"},{\"type\":\"arc\",\"start\": {\"x\": 0,\"y\": 0},\"end\": {\"x\": 9.949,\"y\": 0.165},\"radius\": 300,\"color\":\"#000000\",\"side\":\"right\"},{\"type\":\"arc\",\"start\": {\"x\": 9.949,\"y\": 0.165},\"end\": {\"x\": 25.35,\"y\": 2.185},\"radius\": 80,\"color\":\"#000000\",\"side\":\"left\"},{\"type\":\"arc\",\"start\": {\"x\": 25.35,\"y\": 2.185},\"end\": {\"x\": 35.4,\"y\": 14.2},\"radius\": 13,\"color\":\"#000000\",\"side\":\"left\"},{\"type\":\"line\",\"start\": {\"x\": 35.4,\"y\": 14.2},\"end\": {\"x\": 36.317,\"y\": 32.539},\"color\":\"#000000\"},{\"type\":\"arc\",\"start\": {\"x\": 36.317,\"y\": 32.539},\"end\": {\"x\": 32.904,\"y\": 37.532},\"radius\": 5,\"color\":\"#000000\",\"side\":\"left\"},{\"type\":\"line\",\"start\": {\"x\": 32.904,\"y\": 37.532},\"end\": {\"x\": 20,\"y\": 41.833},\"color\":\"#000000\"}]",
calPoints: "[{\"type\":\"arc\",\"start\": {\"x\": 0,\"y\": 0},\"end\": {\"x\": -9.949,\"y\": 0.165},\"radius\": 300,\"color\":\"#339900\",\"side\":\"right\"},{\"type\":\"arc\",\"start\": {\"x\": -9.949,\"y\": 0.165},\"end\": {\"x\": -25.35,\"y\": 2.185},\"radius\": 80,\"color\":\"#336699\",\"side\":\"right\"},{\"type\":\"arc\",\"start\": {\"x\": -25.35,\"y\": 2.185},\"end\": {\"x\": -35.4,\"y\": 14.2},\"radius\": 13,\"color\":\"#660000\",\"side\":\"right\"},{\"type\":\"arc\",\"start\": {\"x\": 0,\"y\": 0},\"end\": {\"x\": 9.949,\"y\": 0.165},\"radius\": 300,\"color\":\"#99CCCC\",\"side\":\"left\"},{\"type\":\"arc\",\"start\": {\"x\": 9.949,\"y\": 0.165},\"end\": {\"x\": 25.35,\"y\": 2.185},\"radius\": 80,\"color\":\"#CC0033\",\"side\":\"left\"},{\"type\":\"arc\",\"start\": {\"x\": 25.35,\"y\": 2.185},\"end\": {\"x\": 35.4,\"y\": 14.2},\"radius\": 13,\"color\":\"#CC6600\",\"side\":\"left\"}]"
}
id: 1,
createTime: '2025-03-03 12:31:25',
updateTime: '2025-03-03 12:31:25',
name: '60型标准轨',
code: '6001',
points:
'[{"type":"arc","start": {"x": 0,"y": 0},"end": {"x": -9.949,"y": 0.165},"radius": 300,"color":"#000000","side":"right"},{"type":"arc","start": {"x": -9.949,"y": 0.165},"end": {"x": -25.35,"y": 2.185},"radius": 80,"color":"#000000","side":"right"},{"type":"arc","start": {"x": -25.35,"y": 2.185},"end": {"x": -35.4,"y": 14.2},"radius": 13,"color":"#000000","side":"right"},{"type":"line","start": {"x": -35.4,"y": 14.2},"end": {"x": -36.317,"y": 32.539},"color":"#000000"},{"type":"arc","start": {"x": -36.317,"y": 32.539},"end": {"x": -32.904,"y": 37.532},"radius": 5,"color":"#000000","side":"right"},{"type":"line","start": {"x": -32.904,"y": 37.532},"end": {"x": -20,"y": 41.833},"color":"#000000"},{"type":"arc","start": {"x": 0,"y": 0},"end": {"x": 9.949,"y": 0.165},"radius": 300,"color":"#000000","side":"right"},{"type":"arc","start": {"x": 9.949,"y": 0.165},"end": {"x": 25.35,"y": 2.185},"radius": 80,"color":"#000000","side":"left"},{"type":"arc","start": {"x": 25.35,"y": 2.185},"end": {"x": 35.4,"y": 14.2},"radius": 13,"color":"#000000","side":"left"},{"type":"line","start": {"x": 35.4,"y": 14.2},"end": {"x": 36.317,"y": 32.539},"color":"#000000"},{"type":"arc","start": {"x": 36.317,"y": 32.539},"end": {"x": 32.904,"y": 37.532},"radius": 5,"color":"#000000","side":"left"},{"type":"line","start": {"x": 32.904,"y": 37.532},"end": {"x": 20,"y": 41.833},"color":"#000000"}]',
calPoints:
'[{"type":"arc","start": {"x": 0,"y": 0},"end": {"x": -9.949,"y": 0.165},"radius": 300,"color":"#339900","side":"right"},{"type":"arc","start": {"x": -9.949,"y": 0.165},"end": {"x": -25.35,"y": 2.185},"radius": 80,"color":"#336699","side":"right"},{"type":"arc","start": {"x": -25.35,"y": 2.185},"end": {"x": -35.4,"y": 14.2},"radius": 13,"color":"#660000","side":"right"},{"type":"arc","start": {"x": 0,"y": 0},"end": {"x": 9.949,"y": 0.165},"radius": 300,"color":"#99CCCC","side":"left"},{"type":"arc","start": {"x": 9.949,"y": 0.165},"end": {"x": 25.35,"y": 2.185},"radius": 80,"color":"#CC0033","side":"left"},{"type":"arc","start": {"x": 25.35,"y": 2.185},"end": {"x": 35.4,"y": 14.2},"radius": 13,"color":"#CC6600","side":"left"}]',
};
export const railTypes = [ 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轨",
},
{
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 bureauList = [ export const bureauList = [
{
id: 1,
name: "北京铁路局"
},
{
id: 2,
name: "南京铁路局"
},
{
id: 3,
name: "上海铁路局"
},
{
id: 4,
name: "广州铁路局"
}
]
{
id: 1,
name: '北京铁路局',
},
{
id: 2,
name: '南京铁路局',
},
{
id: 3,
name: '上海铁路局',
},
{
id: 4,
name: '广州铁路局',
},
];
export const lineList = [ export const lineList = [
{
id: 1,
name: "京沪线"
},
{
id: 2,
name: "京九线"
},
{
id: 3,
name: "陇海线"
},
{
id: 4,
name: "京广线"
}
]
{
id: 1,
name: '京沪线',
},
{
id: 2,
name: '京九线',
},
{
id: 3,
name: '陇海线',
},
{
id: 4,
name: '京广线',
},
];
export const sectionList = [ export const sectionList = [
{
id: 1,
name: "路段一"
},
{
id: 2,
name: "路段二"
},
{
id: 3,
name: "路段三"
},
{
id: 4,
name: "路段四"
}
]
{
id: 1,
name: '路段一',
},
{
id: 2,
name: '路段二',
},
{
id: 3,
name: '路段三',
},
{
id: 4,
name: '路段四',
},
];
export const dataListFlat: Measurement[] = [
{
id: 1,
name: '测量名称1',
createAt: '2025-03-02 10:20',
line: '京沪线',
section: 'A段',
direction: '上行',
railId: 2,
leftPoints: '[]',
rightPoints: '[]',
bureau: '北京铁路局',
upload: false,
},
{
id: 2,
name: '测量名称2',
createAt: '2025-03-02 12:22',
line: '京沪线',
section: 'B段',
direction: '下行',
railId: 2,
leftPoints: '[]',
rightPoints: '[]',
bureau: '北京铁路局',
upload: false,
},
{
id: 3,
name: '测量名称3',
createAt: '2025-03-02 12:20',
line: '京沪线',
section: 'C段',
direction: '上行',
railId: 2,
leftPoints: '[]',
rightPoints: '[]',
bureau: '北京铁路局',
upload: false,
},
];
export const dataList: Array<{ groupName: string; list: Measurement[] }> = [
{
groupName: '2025-03-02',
list: [
{
id: 1,
name: '测量名称1',
createAt: '2025-03-02 10:20',
line: '京沪线',
section: 'A段',
direction: '上行',
railId: 2,
leftPoints: '[]',
rightPoints: '[]',
bureau: '北京铁路局',
upload: false,
},
{
id: 2,
name: '测量名称2',
createAt: '2025-03-02 12:22',
line: '京沪线',
section: 'B段',
direction: '下行',
railId: 2,
leftPoints: '[]',
rightPoints: '[]',
bureau: '北京铁路局',
upload: false,
},
{
id: 3,
name: '测量名称3',
createAt: '2025-03-02 12:20',
line: '京沪线',
section: 'C段',
direction: '上行',
railId: 2,
leftPoints: '[]',
rightPoints: '[]',
bureau: '北京铁路局',
upload: false,
},
],
},
{
groupName: '2025-02-01',
list: [
{
id: 4,
name: '测量名称2',
createAt: '2025-03-02 10:20',
line: '京沪线',
section: 'D段',
direction: '下行',
railId: 2,
leftPoints: '[]',
rightPoints: '[]',
bureau: '北京铁路局',
upload: false,
},
{
id: 5,
name: '测量名称2',
createAt: '2025-03-02 10:20',
line: '京沪线',
section: 'E段',
direction: '下行',
railId: 2,
leftPoints: '[]',
rightPoints: '[]',
bureau: '北京铁路局',
upload: false,
},
],
},
];
Loading…
Cancel
Save