feat: 联系我们

.eslintrc.cjs

@@ -38,6 +38,8 @@ module.exports = {
     '@typescript-eslint/no-shadow': 'error',
     'no-unused-vars': 'off',
     'no-else-return': 'off',
+    'no-new': 'off',
+    'no-underscore-dangle': [1, { allow: ['_AMapSecurityConfig', '_self'] }],
     '@typescript-eslint/no-unused-vars': 'error',
     'vue-scoped-css/enforce-style-type': ['error', { allows: ['plain', 'scoped', 'module'] }],
     'vue/block-order': [

src/components/common/CommonFooter.vue

 <template>
-  <div class="bg-[#1A1A1A] pt-3 pb-4 footer">
-    <div class="w-[926px] mx-auto">
+  <div class="footer bg-[#1A1A1A] pb-4 pt-3">
+    <div class="mx-auto w-[926px]">
       <div class="flex justify-between">
         <div class="flex flex-col justify-between">
-          <div class="flex text-sm text-white pt-3">
+          <div class="flex pt-3 text-sm text-white">
             <div style="margin-top: -5px" class="flex">
-              <img src="@/assets/images/logo-footer.png" class="w-[33px] h-[26px]" alt="" />
-              <span class="font-yahei font-bold text-white text-2xl">立业云</span>
+              <img src="@/assets/images/logo-footer.png" class="h-[26px] w-[33px]" alt="" />
+              <span class="font-yahei text-2xl font-bold text-white">立业云</span>
             </div>
             <div class="mx-[125px]">
               <div class="h-[22px] border-l border-solid border-[#666666]"></div>
@@ -27,9 +27,9 @@
             <p>邮箱：service@liyeyun.com</p>
           </div>
         </div>
-        <img src="@/assets/images/qr-code.png" class="w-16 h-16" alt="" />
+        <img src="@/assets/images/qr-code.png" class="h-16 w-16" alt="" />
       </div>
-      <p class="text-center mt-3 font-yahei text-xs text-[#F1F3F4]">
+      <p class="mt-3 text-center font-yahei text-xs text-[#F1F3F4]">
         Copyright © 2023 北京华夏幸福数字科技有限公司 丨
         <a href="https://beian.miit.gov.cn" target="_blank">京ICP备2022004539号-5</a>
       </p>

src/main.ts

@@ -12,3 +12,7 @@ app.use(createPinia());
 app.use(router);
 
 app.mount('#app');
+
+(window as any)._AMapSecurityConfig = {
+  serviceHost: 'http://test.api.liyeyun.com/_AMapService',
+};

src/router/router.ts

@@ -21,6 +21,8 @@ const IndustryPolicy = () => import('@/views/industry/IndustryPolicy.vue');
 const MapSelection = () => import('@/views/map/MapSelection.vue');
 /** 关于立业云 */
 const AboutUs = () => import('@/views/about/AboutUs.vue');
+/** 关于立业云 */
+const ContactUs = () => import('@/views/contact/ContactUs.vue');
 /** 合伙人招募 */
 const PartnerEnlist = () => import('@/views/partner/PartnerEnlist.vue');
 /** 产业园详情 */
@@ -62,6 +64,8 @@ export const enum RouteName {
   mapSelection = 'map-selection',
   /** 关于立业云 */
   aboutUs = 'about-us',
+  /** 联系我们 */
+  contactUs = 'contact-us',
   /** 合伙人招募 */
   partnerEnlist = 'partnerEnlist',
   /** 产业园详情 */
@@ -172,6 +176,11 @@ const routes: readonly RouteRecordRaw[] = [
       menuName: '关于立业云',
     },
   },
+  {
+    // 关于立业云
+    ...gen(RouteName.contactUs),
+    component: ContactUs,
+  },
   {
     // 合伙人招募
     ...gen(RouteName.partnerEnlist),

src/views/about/AboutUs.vue

 <!-- 关于立业云 -->
 <template>
   <div>
-    <div class="w-[926px] mx-auto">
-      <img class="w-[926px] h-[200px]" src="@/assets/images/banner-aboutUs.png" alt="" />
+    <div class="mx-auto w-[926px]">
+      <img class="h-[200px] w-[926px]" src="@/assets/images/banner-aboutUs.png" alt="" />
     </div>
     <!-- 关于我们 -->
-    <div class="w-[826px] mx-auto pb-[100px]">
+    <div class="mx-auto w-[826px] pb-[100px]">
       <h2 class="mt-[60px] flex h-8 items-center justify-center">
         <div class="font-yahei text-2xl font-bold leading-8 tracking-[2px] text-[#1A1A1A]">
           关于我们
@@ -15,7 +15,7 @@
         <div class="title-bottom-bg h-1 w-[102px] rounded-[30px]"></div>
       </div>
 
-      <p class="text-sm leading-6 text-[#4d4d4d] mt-5">
+      <p class="mt-5 text-sm leading-6 text-[#4d4d4d]">
         立业云隶属于北京华夏幸福数字科技有限公司，华夏数科是一家产业大数据公司，致力于成为中国领先的产业数字平台。公司基于海量多维的产业大数据，依托先进的人工智能技术平台，创新合伙人合作网络，打造
         “更懂产业”
         的数字化产品与服务体系，赋能企业选址、招商引资、园区运营，助力实体经济高质量发展。
@@ -32,10 +32,10 @@
         <div class="title-bottom-bg h-1 w-[102px] rounded-[30px]"></div>
       </div>
 
-      <div class="flex mt-10 justify-between">
+      <div class="mt-10 flex justify-between">
         <div class="advantage-box font-yahei text-[#c0322b]">
           <p class="text-base font-bold">深度的产业大数据</p>
-          <div class="flex flex-col justify-center items-center text-sm mt-1 h-[92px]">
+          <div class="mt-1 flex h-[92px] flex-col items-center justify-center text-sm">
             <p>区域大数据</p>
             <p>空间大数据</p>
             <p>企业大数据</p>
@@ -44,14 +44,14 @@
         </div>
         <div class="advantage-box font-yahei text-[#c0322b]">
           <p class="text-base font-bold">领先的人工智能技术</p>
-          <div class="flex flex-col justify-center items-center text-sm mt-1 h-[92px]">
+          <div class="mt-1 flex h-[92px] flex-col items-center justify-center text-sm">
             <p>园区大模型</p>
             <p>企业选址</p>
           </div>
         </div>
         <div class="advantage-box font-yahei text-[#c0322b]">
           <p class="text-base font-bold">权威的行业专家</p>
-          <div class="flex flex-col justify-center items-center text-sm mt-1 h-[92px]">
+          <div class="mt-1 flex h-[92px] flex-col items-center justify-center text-sm">
             <p>产业研究院</p>
             <p>都市圈研究院</p>
             <p>招商引资研究院</p>
@@ -59,7 +59,7 @@
         </div>
         <div class="advantage-box font-yahei text-[#c0322b]">
           <p class="text-base font-bold">深厚的资源积累</p>
-          <div class="flex flex-col justify-center items-center text-sm mt-1 h-[92px]">
+          <div class="mt-1 flex h-[92px] flex-col items-center justify-center text-sm">
             <p>二十余年产业发展经验</p>
             <p>全国百城线下渠道网络</p>
             <p>超万人线下合伙人团队</p>

src/views/contact/ContactUs.vue

+<!-- 联系我们 -->
+<template>
+  <div>
+    <div class="mx-auto w-[926px]">
+      <img class="h-[200px] w-[926px]" src="@/assets/images/banner-contactUs.png" alt="" />
+    </div>
+    <!-- 联系我们 -->
+    <div class="mx-auto w-[826px] pb-[100px]">
+      <h2 class="mt-[60px] flex h-8 items-center justify-center">
+        <div class="font-yahei text-2xl font-bold leading-8 tracking-[2px] text-[#1A1A1A]">
+          联系我们
+        </div>
+      </h2>
+      <div class="relative flex h-[17px] items-center justify-center">
+        <div class="title-bottom-bg h-1 w-[102px] rounded-[30px]"></div>
+      </div>
+      <div class="mt-5 flex">
+        <img class="mr-[92px] h-[172px] w-[172px]" src="@/assets/images/logo.png" alt="" />
+        <div class="flex flex-col justify-center font-yahei text-base text-[#1a1a1a]">
+          <p class="mb-[22px]">联系地址：北京市丰台区丰台科技园 华夏幸福创新中心B座3层</p>
+          <p class="mb-[22px]">联系电话：400-831-1221</p>
+          <p>商务合作：service@liyeyun.com</p>
+        </div>
+      </div>
+      <!-- 地图 -->
+      <div id="map" class="mt-10 h-[260px] w-[826px]"></div>
+    </div>
+  </div>
+</template>
+
+<script lang="ts" setup>
+import AMapLoader from '@amap/amap-jsapi-loader';
+import { onMounted } from 'vue';
+
+onMounted(() => {
+  AMapLoader.load({
+    key: '75ff1c8fdbf7f75d6b129998f1b813ba', // 申请好的Web端开发者Key，首次调用 load 时必填
+    version: '2.0', // 指定要加载的 JSAPI 的版本，缺省时默认为 1.4.15
+  })
+    .then((AMap) => {
+      const map = new AMap.Map('map', {
+        // 设置地图容器id
+        resizeEnable: true,
+        zoom: 16,
+        center: ['116.301688', '39.823966'],
+      });
+      new AMap.Marker({
+        map,
+        position: ['116.301688', '39.823966'],
+      });
+      console.log(typeof map);
+    })
+    .catch((e) => {
+      console.log(e);
+    });
+});
+</script>
+<style lang="scss" scoped>
+.title-bottom-bg {
+  background: linear-gradient(
+    90deg,
+    #c0322b 0%,
+    rgba(192, 50, 43, 0.45) 66%,
+    rgba(192, 50, 43, 0) 100%
+  );
+}
+</style>

src/views/home/HomeView.vue

@@ -27,14 +27,14 @@
                 <span @click="changeSearchType('industrial', '84px', '产业园')">找产业园</span>
                 <span @click="changeSearchType('land', '149px', '土地')">找土地</span>
                 <span
-                  @click="changeSearchType('carrier', '202px', '载体')"
                   style="margin-right: 14px"
+                  @click="changeSearchType('carrier', '202px', '载体')"
                 >
                   找载体
                 </span>
                 <span
-                  @click="changeSearchType('category', '272px', '产业分类')"
                   style="margin-right: 14px"
+                  @click="changeSearchType('category', '272px', '产业分类')"
                 >
                   找产业分类
                 </span>