外层套一层AppTab

src/App.tsx

@@ -1,81 +1,35 @@
 import React, { useEffect } from 'react';
-import { Outlet, useLocation, useNavigate } from 'react-router';
-import { Mask, SafeArea, SpinLoading, TabBar, Toast } from 'antd-mobile';
+import { Outlet } from 'react-router';
+import { Toast } from 'antd-mobile';
 
-import icon_1_s from './assets/tabIcon/icon_tab1_s.svg';
-import icon_1_u from './assets/tabIcon/icon_tab1_u.svg';
-// import icon_2_s from './assets/tabIcon/icon_tab2_s.svg';
-// import icon_2_u from './assets/tabIcon/icon_tab2_u.svg';
-import icon_3_s from './assets/tabIcon/icon_tab3_s.svg';
-import icon_3_u from './assets/tabIcon/icon_tab3_u.svg';
-import icon_4_s from './assets/tabIcon/icon_tab4_s.svg';
-import icon_4_u from './assets/tabIcon/icon_tab4_u.svg';
 import Bridge, { bridgeOb, emitBridgeEvent } from './utils/bridge';
 import { useAppDispatch, useAppSelector } from './utils/hooks';
 import { addNewPoint, updateTaskState } from './store/features/measureSlice';
-import { updateBleList, updateDevice, updateSyncProgress } from './store/features/contextSlice';
+import {
+  refreshStationList,
+  updateBleList,
+  updateDevice,
+  updateSyncProgress,
+} from './store/features/contextSlice';
 import { createWebSocket, sharedWsUrl } from './services/socket';
-import { fetchOrgTree, fetchRailTypes, syncBaseData, updateSyncBaseProgress } from './store/features/baseData';
-
-const BottomBar = () => {
-  const navigate = useNavigate();
-  const location = useLocation();
-  const { pathname } = location;
-  const setRouteActive = (value: string) => {
-    navigate(value, { replace: true });
-  };
-
-  const tabs = [
-    {
-      key: '/home/measure',
-      title: '测量',
-      icon_s: icon_1_s,
-      icon_n: icon_1_u,
-    },
-    // {
-    //   key: '/home/setting',
-    //   title: '设置',
-    //   icon_s: icon_2_s,
-    //   icon_n: icon_2_u,
-    // },
-    {
-      key: '/home/bluetooth',
-      title: '蓝牙',
-      icon_s: icon_3_s,
-      icon_n: icon_3_u,
-    },
-    {
-      key: '/home/mine',
-      title: '我的',
-      icon_s: icon_4_s,
-      icon_n: icon_4_u,
-    },
-  ];
-
-  return (
-    <TabBar activeKey={pathname} onChange={(value) => setRouteActive(value)}>
-      {tabs.map((item) => (
-        <TabBar.Item
-          key={item.key}
-          icon={(active: boolean) =>
-            active ? <img src={item.icon_s} alt="icon" /> : <img src={item.icon_n} alt="icon" />
-          }
-          title={item.title}
-        />
-      ))}
-    </TabBar>
-  );
-};
+import {
+  fetchOrgTree,
+  fetchRailTypes,
+  syncBaseData,
+  updateSyncBaseProgress,
+} from './store/features/baseData';
 
 function App() {
   const dispatch = useAppDispatch();
   const baseState = useAppSelector((state) => state.baseData);
+  const contextState = useAppSelector((state) => state.context);
 
+  // 获取轨型数据
   useEffect(() => {
     if (baseState.railTypes.length === 0) {
       dispatch(fetchRailTypes());
     }
-  },[baseState.railTypes.length, dispatch])
+  }, [baseState.railTypes.length, dispatch]);
 
   // 监听推送消息，更新store
   useEffect(() => {
@@ -134,18 +88,22 @@ function App() {
     });
   }, [dispatch]);
 
+  // 预获取车站信息
+  useEffect(() => {
+    if (contextState.currXMCode) {
+      dispatch(
+        refreshStationList({
+          tljCode: contextState.currOrgCode,
+          gwdCode: contextState.currGWDCode,
+          xmCode: contextState.currXMCode,
+        })
+      );
+    }
+  }, [contextState.currGWDCode, contextState.currOrgCode, contextState.currXMCode, dispatch]);
+
   return (
     <>
-      <div className="App">
-        <SafeArea position="top" />
-        <div>
-          <Outlet />
-        </div>
-        <div className="border-t border-[#ebebeb]">
-          <BottomBar />
-        </div>
-        <SafeArea position="bottom" />
-      </div>
+      <Outlet />
 
       {/* <Mask visible={baseState.syncingBaseData}>
         <div className="flex flex-col items-center gap-4 absolute left-1/2 top-1/2 -translate-x-1/2 -translate-y-1/2">

src/AppTab.tsx

@@ -0,0 +1,77 @@
+import React from 'react';
+import { Outlet, useLocation, useNavigate } from 'react-router';
+import { SafeArea, TabBar } from 'antd-mobile';
+
+import icon_1_s from './assets/tabIcon/icon_tab1_s.svg';
+import icon_1_u from './assets/tabIcon/icon_tab1_u.svg';
+// import icon_2_s from './assets/tabIcon/icon_tab2_s.svg';
+// import icon_2_u from './assets/tabIcon/icon_tab2_u.svg';
+import icon_3_s from './assets/tabIcon/icon_tab3_s.svg';
+import icon_3_u from './assets/tabIcon/icon_tab3_u.svg';
+import icon_4_s from './assets/tabIcon/icon_tab4_s.svg';
+import icon_4_u from './assets/tabIcon/icon_tab4_u.svg';
+
+const BottomBar = () => {
+  const navigate = useNavigate();
+  const location = useLocation();
+  const { pathname } = location;
+  const setRouteActive = (value: string) => {
+    navigate(value, { replace: true });
+  };
+
+  const tabs = [
+    {
+      key: '/home/measure',
+      title: '测量',
+      icon_s: icon_1_s,
+      icon_n: icon_1_u,
+    },
+    // {
+    //   key: '/home/setting',
+    //   title: '设置',
+    //   icon_s: icon_2_s,
+    //   icon_n: icon_2_u,
+    // },
+    {
+      key: '/home/bluetooth',
+      title: '蓝牙',
+      icon_s: icon_3_s,
+      icon_n: icon_3_u,
+    },
+    {
+      key: '/home/mine',
+      title: '我的',
+      icon_s: icon_4_s,
+      icon_n: icon_4_u,
+    },
+  ];
+
+  return (
+    <TabBar activeKey={pathname} onChange={(value) => setRouteActive(value)}>
+      {tabs.map((item) => (
+        <TabBar.Item
+          key={item.key}
+          icon={(active: boolean) =>
+            active ? <img src={item.icon_s} alt="icon" /> : <img src={item.icon_n} alt="icon" />
+          }
+          title={item.title}
+        />
+      ))}
+    </TabBar>
+  );
+};
+
+export default function AppTab() {
+  return (
+    <div className="App">
+      <SafeArea position="top" />
+      <div>
+        <Outlet />
+      </div>
+      <div className="border-t border-[#ebebeb]">
+        <BottomBar />
+      </div>
+      <SafeArea position="bottom" />
+    </div>
+  );
+}

src/index.tsx

@@ -2,6 +2,7 @@ import React from 'react';
 import ReactDOM from 'react-dom/client';
 import './index.css';
 import App from './App';
+import AppTab from './AppTab';
 import reportWebVitals from './reportWebVitals';
 import {
   createHashRouter,
@@ -16,7 +17,7 @@ import store from './store/index';
 import Measure from './pages/Measure';
 import Setting from './pages/Setting';
 import Bluetooth from './pages/Bluetooth';
-import Mine from './pages/Mine';
+// import Mine from './pages/Mine';
 import Mine2 from './pages/Mine2';
 import MeasureSave from './pages/MeasureSave';
 import MeasureRecord from './pages/MeasureRecord';
@@ -26,9 +27,9 @@ import UploadList from './pages/UploadList';
 
 const router = createHashRouter(
   createRoutesFromElements(
-    <Route path="/">
+    <Route path="/" element={<App />}>
       <Route index element={<Navigate to="home/measure" replace />} />
-      <Route path="home" element={<App />}>
+      <Route path="home" element={<AppTab />}>
         <Route path="measure" element={<Measure />}></Route>
         {/* <Route path="setting" element={<Setting />}></Route> */}
         <Route path="bluetooth" element={<Bluetooth />}></Route>

src/pages/Measure.tsx

@@ -37,19 +37,6 @@ export default function Measure() {
     }
   }, [baseState.railTypes]);
 
-  // 预获取车站信息
-  useEffect(() => {
-    if (contextState.currXMCode) {
-      dispatch(
-        refreshStationList({
-          tljCode: contextState.currOrgCode,
-          gwdCode: contextState.currGWDCode,
-          xmCode: contextState.currXMCode,
-        })
-      );
-    }
-  },[contextState.currGWDCode, contextState.currOrgCode, contextState.currXMCode, dispatch]);
-
   function drawRailBaseLine(points: string) {
     const benchmarkShapes = JSON.parse(points) as BenchmarkShape[];
     if (canvasRef.current) {

src/pages/MeasureRecord.tsx

@@ -80,7 +80,7 @@ export default function MeasureRecord() {
       <NavBar className="bg-white" onBack={back}>
         测量详情
       </NavBar>
-      <div className="main-page-content overflow-x-hidden overflow-y-auto">
+      <div className="main-page-content ">
         <div className="relative h-0 p-0 pb-[70%] border-y border-[#dedede]">
           <div className="absolute left-0 right-0 top-0 bottom-0 bg-title">
             <MeasurementCanvas
@@ -104,48 +104,52 @@ export default function MeasureRecord() {
         <section>
           <h1 className="h-10 px-4 text-base font-medium leading-10">详细信息</h1>
           {measure && (
-            <div className="grid grid-cols-[auto_1fr] bg-white px-5 py-3 gap-x-5 gap-y-4 text-sm">
-              <p className="text-[#818181]">创建时间</p>
-              <span className="text-text">{measure.createTime}</span>
+            <div
+              className="overflow-x-hidden overflow-y-auto"
+              style={{
+                height: 'calc(100vh - var(--navBarHeight) - (100vw * 0.7) - 50px)',
+              }}
+            >
+              <div className="grid grid-cols-[auto_1fr] bg-white px-5 py-3 gap-x-5 gap-y-4 text-sm ">
+                <p className="text-[#818181]">创建时间</p>
+                <span className="text-text">{measure.createTime}</span>
 
-              <p className="text-[#818181]">测量名称</p>
-              <span className="text-text">{measure.name}</span>
+                <p className="text-[#818181]">测量名称</p>
+                <span className="text-text">{measure.name}</span>
 
-              <p className="text-[#818181]">批次</p>
-              <span className="text-text">{measure.batch}</span>
+                <p className="text-[#818181]">批次</p>
+                <span className="text-text">{measure.batch}</span>
 
-              <p className="text-[#818181]">轨型</p>
-              <span className="text-text">{measure.extraDescObj?.railSize}</span>
+                <p className="text-[#818181]">数据来源</p>
+                <span className="text-text">{measure.extraDescObj?.dataSource}</span>
 
-              <p className="text-[#818181]">数据来源</p>
-              <span className="text-text">{measure.extraDescObj?.dataSource}</span>
+                <p className="text-[#818181]">线路分类</p>
+                <span className="text-text">{measure.extraDescObj?.lineClassify}</span>
 
-              <p className="text-[#818181]">线路分类</p>
-              <span className="text-text">{measure.extraDescObj?.lineClassify}</span>
+                <p className="text-[#818181]">轨型</p>
+                <span className="text-text">{measure.extraDescObj?.railSize}</span>
 
-              <p className="text-[#818181]">轨型</p>
-              <span className="text-text">{measure.extraDescObj?.railSize}</span>
+                <p className="text-[#818181]">铁路局名称</p>
+                <span className="text-text">{measure.extraDescObj?.tljCode}</span>
 
-              <p className="text-[#818181]">铁路局名称</p>
-              <span className="text-text">{measure.extraDescObj?.tljCode}</span>
+                <p className="text-[#818181]">路段名称</p>
+                <span className="text-text">{measure.extraDescObj?.gwdCode}</span>
 
-              <p className="text-[#818181]">路段名称</p>
-              <span className="text-text">{measure.extraDescObj?.gwdCode}</span>
+                <p className="text-[#818181]">线路名称</p>
+                <span className="text-text">{measure.extraDescObj?.xmCode}</span>
 
-              <p className="text-[#818181]">线路名称</p>
-              <span className="text-text">{measure.extraDescObj?.xmCode}</span>
+                <p className="text-[#818181]">车站</p>
+                <span className="text-text">{measure.extraDescObj?.stationCode}</span>
 
-              <p className="text-[#818181]">车站</p>
-              <span className="text-text">{measure.extraDescObj?.stationCode}</span>
+                <p className="text-[#818181]">方向</p>
+                <span className="text-text">{measure.extraDescObj?.xbCode}</span>
 
-              <p className="text-[#818181]">方向</p>
-              <span className="text-text">{measure.extraDescObj?.xbCode}</span>
+                <p className="text-[#818181]">股别</p>
+                <span className="text-text">{measure.extraDescObj?.unitType}</span>
 
-              <p className="text-[#818181]">股别</p>
-              <span className="text-text">{measure.extraDescObj?.unitType}</span>
-
-              <p className="text-[#818181]">里程</p>
-              <span className="text-text">{`${measure.extraDescObj?.mile}公里+${measure.extraDescObj?.meter}米`}</span>
+                <p className="text-[#818181]">里程</p>
+                <span className="text-text">{`${measure.extraDescObj?.mile}公里+${measure.extraDescObj?.meter}米`}</span>
+              </div>
             </div>
           )}
         </section>

src/pages/MeasureSave.tsx

@@ -86,6 +86,7 @@ export default function MeasureSave() {
       dataSource: dataSourceCode[0],
       unitType: unitType[0],
       mileage: `${mile}+${meter.toString().padStart(3, '0')}`,
+      radius: '',
       extraDesc: JSON.stringify(desc),
     };
     Bridge.saveMeasure(dto).then((res) => {

src/pages/MeasurementList.tsx

@@ -1,4 +1,4 @@
-import { NavBar, Toast } from 'antd-mobile';
+import { Dialog, NavBar, Toast } from 'antd-mobile';
 import { useNavigate } from 'react-router-dom';
 import MeasureGroups from '../components/MeasureGroups';
 import { useCallback, useEffect, useState } from 'react';
@@ -81,7 +81,7 @@ export default function MeasurementList() {
     }
   };
 
-  const onDeleteClick = async () => {
+  async function deleteRecords() {
     const res = await Bridge.deleteRecords({ ids: selectedIds });
     if (res.success) {
       setSelectedIds([]);
@@ -90,6 +90,14 @@ export default function MeasurementList() {
     } else {
       Toast.show(res.message);
     }
+  }
+  const onDeleteClick = async () => {
+    Dialog.confirm({
+      content: '确定是否删除？',
+      onConfirm: () => {
+        deleteRecords();
+      },
+    });
   };
 
   const right = (

src/pages/UploadList.tsx

@@ -122,13 +122,14 @@ export default function UploadList() {
   const back = () => navigate(-1);
 
   const right = (
-    <div
-      onClick={() => setShowMenu(!showMenu)}
-      className="flex justify-end gap-x-2"
-      style={{ fontSize: 24 }}
-    >
-      <MoreOutline />
-    </div>
+    // <div
+    //   onClick={() => setShowMenu(!showMenu)}
+    //   className="flex justify-end gap-x-2"
+    //   style={{ fontSize: 24 }}
+    // >
+    //   <MoreOutline />
+    // </div>
+    <></>
   );
 
   return (

src/services/apiTypes.ts

@@ -50,6 +50,7 @@ export type MeasurementDTO = {
   xbCode: string; // 行别
   mileage: string; // 里程
   unitType: string; // 股别
+  radius: string;
   extraDesc: string; // 额外描述
 };
 

src/setupProxy.js

@@ -8,6 +8,14 @@ module.exports = function (app) {
   //     changeOrigin: true,
   //   })
   // );
+  // app.use(
+  //   '/api/basic',
+  //   createProxyMiddleware({
+  //     target: 'http://localhost:8080/api/basic',
+  //     changeOrigin: true,
+  //     pathFilter: ['/ktj', '/org', '/station'],
+  //   })
+  // );
   app.use(
     '/api',
     createProxyMiddleware({