update

src/assets/ts/antd.ts

@@ -1,20 +1,6 @@
 import type { App } from 'vue';
-import {
+import { Form, Input, Button, Radio, Modal, Table, Select, Spin } from 'ant-design-vue';
-    Form,
-    Input,
-    Button,
-    Radio,
-    Modal,
-    Table,
-    Select
-} from 'ant-design-vue';
 
 export default function registerGlobComp(app: App) {
-    app.use(Button)
+    app.use(Button).use(Form).use(Input).use(Radio).use(Modal).use(Table).use(Select).use(Spin);
-        .use(Form)
-        .use(Input)
-        .use(Radio)
-        .use(Modal)
-        .use(Table)
-        .use(Select)
 }

src/components/body-d-left/bodyLeftHooks.ts

@@ -0,0 +1,33 @@
+import { ref } from 'vue';
+
+export const timeTab = [
+    {
+        name: '全部',
+        value: '1',
+    },
+    {
+        name: '本年',
+        value: '2',
+    },
+    {
+        name: '本月',
+        value: '3',
+    },
+    {
+        name: '本周',
+        value: '4',
+    },
+];
+
+export function useSpin() {
+    const spinning = ref(true);
+
+    function setSpin(flag: boolean) {
+        spinning.value = flag;
+    }
+
+    return {
+        spinning,
+        setSpin,
+    };
+}

src/components/body-d-left/left.api.ts

@@ -1,5 +1,8 @@
-import { get } from '../../api/request'
+import { get } from '../../api/request';
+
 enum Api {
-    server='/health-emergency/emergency/tblUserHelp/statistics'
+    server = '/health-emergency/emergency/tblUserHelp/statistics',
 }
-export const list = (params) => get(Api.server, params)
+
+export const list = (params) => get(Api.server, params);
+//主诉分类

src/components/body-d-left/oneL.vue

@@ -6,16 +6,17 @@
                 <span
                     v-for="(item, index) in typeTime"
                     :key="index"
-                    :class="selectIndex === index ? 'select' : 'unSelect'"
+                    :class="[selectIndex === index ? 'select' : 'unSelect']"
                     @click="handleSelect(index, item.value)"
                     >{{ item.name }}</span
                 >
             </div>
             <div class="server-container">
                 <div v-for="(item, index) in dataLists" :key="index" class="server-item">
-                    <span>{{ item.title }}</span>
+                    <span>{{ item?.title }}</span>
-                    <span>{{ item.iphone }}</span>
+                    <span>{{ item?.gross }}</span>
                 </div>
+                <a-spin :spinning="spinning" class="spin"></a-spin>
             </div>
         </div>
     </div>
@@ -24,59 +25,33 @@
     import { onMounted, ref } from 'vue';
     import PublicTitle from '../publicTitle.vue';
     import { list } from './left.api';
+    import { timeTab, useSpin } from '/@/components/body-d-left/bodyLeftHooks.ts';
 
-    const typeTime = ref([
+    const typeTime = ref(timeTab);
-        {
+    const dataLists = ref([]);
-            name: '全部',
-            value: '1',
-        },
-        {
-            name: '本年',
-            value: '2',
-        },
-        {
-            name: '本月',
-            value: '3',
-        },
-        {
-            name: '本周',
-            value: '4',
-        },
-    ]);
-    const dataLists = ref([
-        {
-            title: '最新呼入电话',
-            iphone: '18394578789',
-        },
-        {
-            title: '最新呼入电话',
-            iphone: '18394578789',
-        },
-        {
-            title: '最新呼入电话',
-            iphone: '18394578789',
-        },
-        {
-            title: '最新呼入电话',
-            iphone: '18394578789',
-        },
-    ]);
     const selectIndex = ref(0);
     const selectVal = ref('1');
+    const { setSpin, spinning } = useSpin();
     onMounted(() => {
         getList();
     });
 
-    function getList() {
+    async function getList() {
-        list({
+        try {
-            condition: selectVal.value,
+            const { code, result } = (await list({ condition: selectVal.value })) || [];
-        }).then(() => {});
+            setSpin(!spinning.value);
+            if (code != 200) {
+                return;
+            }
+            dataLists.value = result?.map((item) => ({ ...item, title: '最新呼入电话' }));
+        } catch {
+            setSpin(!spinning.value);
+        }
     }
 
     function handleSelect(index: number, value: string) {
         selectIndex.value = index;
         selectVal.value = value;
-        console.log(selectVal.value, value);
         getList();
     }
 </script>
@@ -85,19 +60,31 @@
         height: calc(100% - 40px);
 
         .server-container {
-            color: #a3a4a4;
+            color: #fff;
             padding-top: 4%;
             height: 88%;
             display: grid;
             align-items: start;
+            overflow-y: auto;
+            position: relative;
+
+            > :nth-child(1) {
+                padding-top: 0 !important;
+            }
+
+            .spin {
+                position: absolute;
+                left: 50%;
+                top: 50%;
+            }
 
             .server-item {
                 font-size: 16px;
+                padding: 6px 0;
 
                 span {
                     display: inline-block;
                     width: 50%;
-                    font-weight: bold;
                 }
 
                 span:nth-child(1) {
@@ -110,6 +97,10 @@
                     padding-right: 6%;
                 }
             }
+
+            .server-item:nth-child(2n) {
+                background-color: #0a0a0c;
+            }
         }
     }
 </style>

src/components/chinaMap/chinaHooks.ts

@@ -1,18 +1,31 @@
+import { getAllList } from '/@/components/chinaMap/chinaMapApi.ts';
+
+export enum TabType {
+    all = '', //所有资源
+    youTianYiYuan = '1', //油田医院
+    heZuoYiYuan = '2', //合作医院
+    yiLiaoDian = '3', //医疗点
+}
+
 export const tabList = [
     {
         name: '所有资源',
+        type: TabType.all,
     },
     {
         name: '油田医院',
+        type: TabType.youTianYiYuan,
     },
     {
         name: '医疗点',
+        type: TabType.yiLiaoDian,
     },
     {
         name: '救护车',
     },
     {
         name: '合作医院',
+        type: TabType.heZuoYiYuan,
     },
     {
         name: '地方医院',
@@ -24,6 +37,17 @@ export const tabList = [
         name: '急救路线',
     },
 ];
+
+export function mapApiSwitch(type: string, params: any) {
+    const basicParams = {
+        lat: 34, //纬度34
+        lon: 108, //经度
+    };
+    if ([TabType.all, TabType.yiLiaoDian, TabType.heZuoYiYuan].includes(type)) {
+        return getAllList({ ...basicParams, ...params });
+    }
+}
+
 export const mapIcon1 = new URL('/@/assets/img/mapIcon1.png', import.meta.url).href;
 export const mapIcon2 = new URL('/@/assets/img/mapIcon2.png', import.meta.url).href;
 export const mapIcon3 = new URL('/@/assets/img/mapIcon3.png', import.meta.url).href;

src/components/chinaMap/chinaMap.vue

@@ -60,9 +60,10 @@
 <script lang="ts" setup>
     import { onMounted, ref } from 'vue';
     import * as echarts from 'echarts';
-    import mapJson from '/@/components/chinaMap/json/c';
+    import mapJson from '/@/components/chinaMap/json/c.json';
-    import { tabList, mapIcons, legendList, getTimeStr, getKmStr, createChartOption } from './chinaHooks.ts';
+    import { tabList, mapIcons, legendList, getTimeStr, getKmStr, createChartOption, mapApiSwitch } from '/@/components/chinaMap/chinaHooks';
     import { message } from 'ant-design-vue';
+    import { getAllList } from '/@/components/chinaMap/chinaMapApi';
 
     const formState = ref({
         start: '西安北站',
@@ -85,7 +86,7 @@
         },
     ]);
 
-    function changeTab(i) {
+    function changeTab(i: number) {
         let x = Math.random() + 5 - Math.floor(Math.random() * 10) - i + Math.random() * 3.5;
         let y = Math.floor(Math.random() * 10) - 5 + Math.random() + i + Math.random() * 5;
         const o = {
@@ -98,38 +99,6 @@
             symbolSize: [25, 63],
             symbol: 'image://' + mapIcons[Math.floor(Math.random() * 6)], // 图片 URL
         };
-        const line = {
-            name: '线路',
-            type: 'lines',
-            coordinateSystem: 'geo',
-            zlevel: 100,
-            large: true,
-            effect: {
-                show: true,
-                constantSpeed: 30,
-                symbol: 'arrow', //ECharts 提供的标记类型包括 'circle', 'rect', 'roundRect', 'triangle', 'diamond', 'pin', 'arrow'
-                symbolSize: 0,
-                trailLength: 0,
-            },
-            lineStyle: {
-                normal: {
-                    color: '#0fff17',
-                    width: 2,
-                    opacity: 1.0,
-                    curveness: 0.15,
-                },
-            },
-            data: [
-                {
-                    fromName: '六安',
-                    toName: '合肥市',
-                    coords: [
-                        [116.27, 31.786],
-                        [117.37, 31.386],
-                    ],
-                },
-            ],
-        };
         icons.value = [];
         icons.value.push(o);
         // icons.value.push(line);
@@ -138,11 +107,17 @@
         initMap(myChart);
     }
 
+    async function getMapData(params) {
+        const data = await mapApiSwitch(params.type, {});
+        console.log('--->data', data);
+    }
+
     onMounted(() => {
         console.log('reload');
         let myChart = echarts.init(document.querySelector('.china-map-container'));
         echarts.registerMap('china', mapJson);
         initMap(myChart);
+        getMapData({ type: tabList[0].type });
     });
 
     function initMap(myChart) {
@@ -212,6 +187,10 @@
         panelTitle.value = str;
     }
 
+    /**
+     * @desc 路线规划
+     * @param callback
+     */
     function searchRoute(callback: ((this: MediaQueryList, ev: MediaQueryListEvent) => any) | null) {
         showRoutePanel.value = false;
         panelTitle.value = '';
@@ -248,7 +227,7 @@
                 setTitle(routes[0]);
                 let arr = [];
                 arr.push(data.originName);
-                routes[0].steps.map((item) => {
+                routes[0].steps.map((item: any) => {
                     arr.push(item.instruction);
                 });
                 arr.push(data.destinationName);

src/components/chinaMap/chinaMapApi.ts

@@ -0,0 +1,9 @@
+import {get} from '/@/api/request.ts';
+
+export enum Api {
+    allList = '/health-emergency/emergency/tblAmbulanceGps/getAllList',
+}
+
+// 获取所有资源
+export const getAllList = (params) => get(Api.allList, params);
+//获取救护车GPS信息

tsconfig.json

@@ -3,9 +3,19 @@
     "target": "ES2020",
     "useDefineForClassFields": true,
     "module": "ESNext",
-    "lib": ["ES2020", "DOM", "DOM.Iterable"],
+    "lib": [
+      "ES2020",
+      "DOM",
+      "DOM.Iterable"
+    ],
     "skipLibCheck": true,
-
+    "baseUrl": ".",
+    /* 配置文件路径识别 */
+    "paths": {
+      "/@/*": [
+        "src/*"
+      ]
+    },
     /* Bundler mode */
     "moduleResolution": "bundler",
     "allowImportingTsExtensions": true,
@@ -13,13 +23,22 @@
     "isolatedModules": true,
     "noEmit": true,
     "jsx": "preserve",
-
     /* Linting */
     "strict": true,
     "noUnusedLocals": true,
     "noUnusedParameters": true,
     "noFallthroughCasesInSwitch": true
   },
-  "include": ["src/**/*.ts", "src/**/*.d.ts", "src/**/*.tsx", "src/**/*.vue"],
+  "include": [
-  "references": [{ "path": "./tsconfig.node.json" }]
+    "src/**/*.ts",
+    "src/**/*.d.ts",
+    "src/**/*.tsx",
+    "src/**/*.vue",
+    "src/**/*.json"
+  ],
+  "references": [
+    {
+      "path": "./tsconfig.node.json"
+    }
+  ]
 }

vite.config.ts

@@ -23,6 +23,7 @@ export default defineConfig({
                 replacement: pathResolve('src') + '/',
             },
         ],
+        extensions: ['.js', '.ts', '.mjs', '.vue', '.json', '.less', '.css'],
     },
     server: {
         host: true,