图标

.eslintrc.cjs

@@ -38,7 +38,7 @@ module.exports = {
     'no-unused-vars': 'off',
     'no-else-return': 'off',
     '@typescript-eslint/no-unused-vars': 'error',
-    'vue-scoped-css/enforce-style-type': ['error', { allows: ['plain'] }],
+    'vue-scoped-css/enforce-style-type': ['error', { allows: ['plain', 'scoped'] }],
     'vue/block-order': [
       'error',
       {

components.d.ts

@@ -32,6 +32,8 @@ declare module 'vue' {
     ElSubMenu: typeof import('element-plus/es')['ElSubMenu']
     ElSwitch: typeof import('element-plus/es')['ElSwitch']
     ElTimePicker: typeof import('element-plus/es')['ElTimePicker']
+    ListIndustryCategory: typeof import('./src/components/list/list-industryCategory.vue')['default']
+    ListLand: typeof import('./src/components/list/list-land.vue')['default']
     ListPagination: typeof import('./src/components/list/list-pagination.vue')['default']
     RouterLink: typeof import('vue-router')['RouterLink']
     RouterView: typeof import('vue-router')['RouterView']

src/App.vue

 <template>
   <div>
     <ElContainer class="min-h-screen">
-      <ElHeader>
       <CommonHeader :menu-list="menuList" :current-path="currentPath"></CommonHeader>
-      </ElHeader>
       <ElMain>
         <RouterView />
       </ElMain>

src/assets/styles/reset.scss

+html,body {
+  font-family: -apple-system,BlinkMacSystemFont,PingFang SC,Microsoft YaHei,Helvetica Neue,Source Han Sans SC,Noto Sans CJK SC,WenQuanYi Micro Hei,sans-serif;
+}

src/components/common/CommonHeader.vue

 <template>
-  <div class="flex items-center">
-    <div>logo</div>
-    <div class="flex flex-1 justify-center">
+  <div class="flex items-center justify-between pt-[12px] pl-[40px] header-view">
+    <!-- <div>logo</div> -->
+    <div class="flex flex-1 justify-start">
       <ElMenu
         class="!border-none"
         mode="horizontal"
@@ -28,7 +28,13 @@
         </template>
       </ElMenu>
     </div>
-    <div>登录</div>
+    <div class="flex items-center">
+      <span>登录/注册</span>
+      <div class="flex items-center">
+        <img src="@/assets/images/icon-phone_call.png" />
+        <span>400-900-1786</span>
+      </div>
+    </div>
   </div>
 </template>
 <script lang="ts" setup>
@@ -51,3 +57,8 @@ const getParentName = (menu: HeaderMenuItem) => {
 
 const handleMenuChange = () => {};
 </script>
+<style scoped>
+.header-view {
+  box-shadow: 0px 2px 8px 0px rgba(90, 0, 0, 0.1);
+}
+</style>

src/views/MapView.vue

@@ -12,7 +12,7 @@
         <div id="container"></div>
         <div id="panel"></div>
         <div class="map-table">
-          <div class="table-serch">
+          <div class="table-search">
             <ul>
               <li
                 search="highway"
@@ -51,7 +51,7 @@
               </li>
             </ul>
           </div>
-          <div class="map-serch-info">
+          <div class="map-search-info">
             <p
               class="position-item"
               v-for="item in infoList"
@@ -70,14 +70,17 @@
 import { onMounted, onUnmounted, ref } from 'vue';
 import AMapLoader from '@amap/amap-jsapi-loader';
 
-let map1 = null;
-window._AMapSecurityConfig = {
+let map1: any = null;
+interface Window {
+  _AMapSecurityConfig: { serviceHost?: string };
+}
+(window as any)._AMapSecurityConfig = {
   serviceHost: 'http://test.api.liyeyun.com/_AMapService',
 };
-let placeSearch = null;
-let infoWindow = null;
-let markers = [];
-let AMapRoot = null;
+let placeSearch: any = null;
+let infoWindow: any = null;
+let markers: any = [];
+let AMapRoot: any = null;
 onMounted(() => {
   AMapLoader.load({
     key: '75ff1c8fdbf7f75d6b129998f1b813ba', // 申请好的Web端开发者Key，首次调用 load 时必填
@@ -98,9 +101,8 @@ onMounted(() => {
         label: {
           content: '园区位置',
           direction: 'bottom',
-          offset: new AMap.Pixel(0, 0)
-        }
-
+          offset: new AMap.Pixel(0, 0),
+        },
 
         // offset: new AMap.Pixel(-13, -30),
         // content: item.name
@@ -121,21 +123,21 @@ onMounted(() => {
     });
 });
 
-let infoList = ref([]);
-const handleSearch = (keyWords, radius, type) => {
+let infoList = ref<any[]>([]);
+const handleSearch = (keyWords: String, radius: Number, type: String) => {
   map1.remove(markers);
   placeSearch.setType(type);
   placeSearch.searchNearBy(
     keyWords,
-    new AMap.LngLat(116.506911, 37.434738),
+    new AMapRoot.LngLat(116.506911, 37.434738),
     radius,
-    (status, results) => {
+    (status: String, results: any) => {
       infoList.value = [];
       console.log('searchNearBy', status, results);
       if (status === 'complete') {
         infoList.value = results.poiList.pois;
         for (let item of results.poiList.pois) {
-          const marker = new AMap.Marker({
+          const marker = new AMapRoot.Marker({
             map: map1,
             position: [item.location.lng, item.location.lat],
             // offset: new AMap.Pixel(-13, -30),
@@ -149,11 +151,11 @@ const handleSearch = (keyWords, radius, type) => {
             info.push(`<p class='input-item'>${item.name}</p>`);
             info.push(`<p class='input-item'>${item.distance}米</p></div>`);
 
-            infoWindow = new AMap.InfoWindow({
+            infoWindow = new AMapRoot.InfoWindow({
               content: info.join(''), //使用默认信息窗体框样式，显示信息内容
               isCustom: true,
               autoMove: false,
-              offset: new AMap.Pixel(0, -35),
+              offset: new AMapRoot.Pixel(0, -35),
             });
             infoWindow.open(map1, [item.location.lng, item.location.lat]);
           });
@@ -171,7 +173,7 @@ const handleSearch = (keyWords, radius, type) => {
   );
 };
 
-const showInfoWindow = (info) => {
+const showInfoWindow = (info: any) => {
   let infoContent = [];
   infoContent.push("<div class='input-card'>");
   infoContent.push(`<p class='input-item'>${info.name}</p>`);
@@ -212,7 +214,7 @@ onUnmounted(() => {
   right: 0px;
   z-index: 99;
 }
-.table-serch {
+.table-search {
   padding-bottom: 8px;
   background: #ffffff;
   box-shadow: 0px 1px 10px 0px rgba(31, 108, 221, 0.11);
@@ -239,7 +241,7 @@ onUnmounted(() => {
   float: left;
   margin-top: 8px;
 }
-.map-serch-info {
+.map-search-info {
   width: 290px;
   height: 158px;
   padding: 20px;