feat: 移动端适配

b3b59b92 · qinjianhui · 4dbbdab9 · b3b59b92 · b3b59b92 · b3b59b92
Commit b3b59b92 authored Mar 09, 2023 by qinjianhui
16 changed files
--- a/package-lock.json
+++ b/package-lock.json
--- a/package.json
+++ b/package.json
@@ -56,6 +56,8 @@
    "less-loader": "^5.0.0",
    "mockjs": "^1.1.0",
    "prettier": "^2.2.1",
+    "sass": "^1.58.3",
+    "sass-loader": "^10",
    "stylus": "~0.54.7",
    "stylus-loader": "~3.0.2",
    "uglifyjs-webpack-plugin": "~2.2.0",

--- a/src/assets/register.jpg
+++ b/src/assets/register.jpg
--- a/src/components/footer.vue
+++ b/src/components/footer.vue
@@ -30,7 +30,7 @@ export default {
  },
 }
 </script>
-<style scoped>
+<style scoped lang="scss">
 .banner_footer {
  color: #fff;
  background-color: #20222e;
@@ -59,4 +59,18 @@ export default {
  color: #fff;
  text-decoration: none;
 }
+@media screen and (max-width: 1100px) {
+  .banner_footer {
+    padding: 20px;
+    .bottom-text {
+      padding: 0;
+    }
+    .bottom-text > span {
+      margin-left: 0 !important;
+      line-height: 26px;
+    }
+  }
+}
 </style>
--- a/src/components/head.vue
+++ b/src/components/head.vue
 <template>
  <header class="header" :class="{ 'no-shadow': !shadow }">
-    <div class="container">
+    <headerNavMobile v-if="$isMobile" :nav="navbar"></headerNavMobile>
+    <div class="container" v-else>
      <div class="logo">
        <span class="logo_text">
          <img src="../assets/logo.png" height="40px" />
@@ -33,6 +34,8 @@
 </template>
 <script>
+import headerNavMobile from './headerNavMobile.vue'
 export default {
  props: {
    shadow: { type: Boolean },
@@ -40,6 +43,9 @@ export default {
  inject: {
    scrollParent: 'scrollParent',
  },
+  components: {
+    headerNavMobile,
+  },
  data() {
    return {
      navbar: [
@@ -80,11 +86,14 @@ export default {
 .header {
  position: fixed;
  z-index: 999;
-  /* background: #0089ff; */
  top: 0;
  right: 0;
  left: 0;
-  /* box-shadow: 0 2px 10px 0 rgb(0 39 98 / 66%); */
+}
+@media screen and (max-width: 1100px) {
+  .header {
+    position: sticky;
+  }
 }
 .header.no-shadow {

--- a/src/components/headerNavMobile.vue
+++ b/src/components/headerNavMobile.vue
+<template>
+  <div class="header-nav-mobile">
+    <div class="header-nav-mobile_trigger">
+      <a class="nav-icon icon-menu" href="javascript:;" @click="toggleShow"></a>
+    </div>
+    <div class="header-nav-mobile_logo">
+      <img src="../assets/logo.png" height="40px" />
+    </div>
+    <div class="header-nav-mobile_login">
+      <span>登录</span>
+      <span style="margin: 0 5px">|</span>
+      <span>注册</span>
+    </div>
+    <transition name="header-nav-mobile">
+      <div
+        v-show="showing"
+        class="header-nav-mobile-overlay"
+        @click="toggleShow">
+        <ul class="header-nav-mobile-items" @click.stop>
+          <li
+            v-for="(r, i) in nav"
+            :key="i"
+            class="header-nav-mobile-item"
+            :class="{ active: isRouteActive(r) }">
+            <router-link
+              class="header-nav-mobile-link"
+              :to="r.path"
+              @click.native="toggleShow">
+              {{ r.name }}
+            </router-link>
+          </li>
+        </ul>
+      </div>
+    </transition>
+  </div>
+</template>
+<script>
+export default {
+  name: 'headerNavMobile',
+  data() {
+    return {
+      showing: false,
+    }
+  },
+  props: {
+    nav: {
+      type: Array,
+    },
+  },
+  methods: {
+    toggleShow() {
+      this.showing = !this.showing
+    },
+    isRouteActive(nav) {
+      const path = this.$route.path
+      if (nav.path === path) return true
+    },
+  },
+}
+</script>
+<style scoped lang="scss">
+.header-nav-mobile {
+  height: 50px;
+  background-color: #2f3032;
+  display: flex;
+  color: #fff;
+  align-items: center;
+  padding: 0 10px;
+}
+.header-nav-mobile_logo {
+  flex: 1;
+  height: 100%;
+  display: flex;
+  align-items: center;
+}
+.header-nav-mobile_logo img {
+  width: 100%;
+  object-fit: contain;
+}
+.header-nav-mobile_login {
+  flex: 1;
+  display: flex;
+  font-size: 12px;
+  margin-right: 10px;
+  justify-content: flex-end;
+}
+.header-nav-mobile_trigger {
+  flex: 1;
+}
+.nav-icon {
+  width: 25px;
+  height: 25px;
+  display: block;
+}
+.icon-menu {
+  background-size: 100%;
+  background-repeat: no-repeat;
+  background-position: center;
+  background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACgAAAAcCAYAAAATFf3WAAAAyklEQVRYR+2WMQ6BQRCFvzmHgkaidgI3UEjcQUSBygV0NOIQhIQTcAK1kpM8GcV/gbHJSHb62fn2vZ2ZNUltYAN0yBUvYGmSTsAoF1tDc/4LwNwWJ7W2wbIKGFSgKhgUkKrgTxSU1M+46szs4ZtkDmyjNy2Uv3DAGzAoVCB67N0BJ8Ae0jWMgOm3iyX1AN/JmeJtZs86ZqKWVAWrglEFovn536CkLrDLOAeBmW+SCzCMWlEo/+qAB2BcqED02KMDtoB1xu8WsErfJB+rXD/DrYeGMwAAAABJRU5ErkJggg==);
+}
+.header-nav-mobile-enter-active,
+.header-nav-mobile-leave-active {
+  transition: 0.3s;
+}
+.header-nav-mobile-enter,
+.header-nav-mobile-leave-to {
+  transform: translateX(-300px);
+}
+.header-nav-mobile-overlay {
+  position: fixed;
+  top: 0;
+  left: 0;
+  width: 100vw;
+  height: 100vh;
+  z-index: 99999;
+}
+.header-nav-mobile-items {
+  box-sizing: border-box;
+  width: 260px;
+  height: 100%;
+  background-color: #000;
+  margin: 0;
+  padding: 30px 20px;
+}
+.header-nav-mobile-item,
+.header-nav-mobile-child {
+  list-style-type: none;
+  line-height: 50px;
+  letter-spacing: 4px;
+  &.active > .header-nav-mobile-link {
+    color: var(--primary-color);
+  }
+}
+.header-nav-mobile-item.active {
+  .header-nav-mobile-link {
+    position: relative;
+    &::after {
+      position: absolute;
+      top: 100%;
+      left: 0;
+      content: '';
+      display: block;
+      width: 80px;
+      height: 2px;
+      background-color: var(--primary-color);
+    }
+  }
+}
+.header-nav-mobile-item {
+  font-size: 16px;
+  color: #fff;
+}
+.header-nav-mobile-child {
+  font-size: 14px;
+  color: #999;
+}
+.header-nav-mobile-children {
+  margin: 0;
+  padding: 0;
+}
+.header-nav-mobile-link {
+  display: block;
+  width: 100%;
+  height: 100%;
+  color: inherit;
+  text-decoration: none;
+  cursor: pointer;
+  border-bottom: solid 1px #2c2c2c;
+}
+.header-nav-mobile-item > .header-nav-mobile-link {
+  display: flex;
+  .expand-icon {
+    margin-left: auto;
+    margin-right: 20px;
+  }
+}
+.header-nav-mobile-child > .header-nav-mobile-link {
+  padding-left: 10px;
+  &::after {
+    display: none !important;
+  }
+}
+</style>
--- a/src/components/product-intro.vue
+++ b/src/components/product-intro.vue
 <template>
  <div class="product-intro">
    <div class="function_bg">
-      <h2 style="text-align: center; padding-bottom: 40px">产品优势</h2>
+      <h2 :style="`text-align: center; ${$isMobile ? 'padding-bottom:30px;font-size:18px' : 'padding-bottom: 40px'}`">产品优势</h2>
      <div class="product-pros">
-        <!-- <div class="product-pros-item">
-          <div class="grid-content">
-            <p>
-              <svg
-                t="1657187271793"
-                class="icon"
-                viewBox="0 0 1024 1024"
-                version="1.1"
-                xmlns="http://www.w3.org/2000/svg"
-                p-id="1683"
-                width="32"
-                height="32">
-                <path
-                  d="M673.793824 525.149534a127.976004 127.976004 0 1 0 127.976004 127.976005 128.135975 128.135975 0 0 0-127.976004-127.976005z m0 191.964007a63.988002 63.988002 0 1 1 63.988002-63.988002 64.05199 64.05199 0 0 1-63.988002 63.988002z"
-                  fill="#1296db"
-                  p-id="1684"></path>
-                <path
-                  d="M63.988162 63.988002h767.856027v200.026495h63.988002V38.584765A38.616759 38.616759 0 0 0 857.247426 0H38.584925A38.616759 38.616759 0 0 0 0.00016 38.584765v946.638506A38.616759 38.616759 0 0 0 38.584925 1023.808036h345.855153v-63.988002H63.988162z"
-                  fill="#1296db"
-                  p-id="1685"></path>
-                <path
-                  d="M969.450388 720.792851a21.276011 21.276011 0 0 1-8.382428-19.83628 264.078485 264.078485 0 0 0 2.047616-31.834031 269.837405 269.837405 0 0 0-2.39955-34.93745 21.595951 21.595951 0 0 1 8.446416-20.31619l45.911392-33.753672a21.435981 21.435981 0 0 0 5.854902-27.994751l-73.426233-127.208148a21.435981 21.435981 0 0 0-27.194901-8.926326l-53.909892 23.67556a21.308005 21.308005 0 0 1-21.244016-2.591514 287.562082 287.562082 0 0 0-55.669562-31.898019 21.308005 21.308005 0 0 1-12.989565-17.148784l-6.590764-59.348872a21.435981 21.435981 0 0 0-21.308005-19.068425h-146.852465a21.435981 21.435981 0 0 0-21.339999 19.068425l-6.590764 59.348872a21.339999 21.339999 0 0 1-12.95757 17.148784 287.78604 287.78604 0 0 0-55.25364 31.578079 21.308005 21.308005 0 0 1-21.180029 2.55952l-54.837718-24.027494a21.435981 21.435981 0 0 0-27.194901 8.894332l-73.426232 127.208148a21.435981 21.435981 0 0 0 5.854902 27.962757l46.391301 34.105606a21.595951 21.595951 0 0 1 8.414423 20.348184 269.933387 269.933387 0 0 0-2.39955 35.321378 261.774917 261.774917 0 0 0 1.855652 30.394301 21.308005 21.308005 0 0 1-8.414423 19.772292l-46.263325 34.041617a21.435981 21.435981 0 0 0-5.854902 27.962757l73.458226 127.176155a21.435981 21.435981 0 0 0 27.130913 8.926326l50.358558-22.075861a21.244017 21.244017 0 0 1 21.435981 2.815473 287.94601 287.94601 0 0 0 59.668812 34.809473 21.276011 21.276011 0 0 1 12.925576 17.11679l6.07886 54.709742a21.435981 21.435981 0 0 0 21.276011 19.036431h146.884459a21.435981 21.435981 0 0 0 21.308005-19.068425l5.982878-53.97388a21.276011 21.276011 0 0 1 13.053553-17.148784 287.62607 287.62607 0 0 0 60.308692-34.681497 21.244017 21.244017 0 0 1 21.403987-2.751484l50.102605 21.947884a21.435981 21.435981 0 0 0 27.162907-8.926326l73.426233-127.176155a21.435981 21.435981 0 0 0-5.854902-27.99475z m-78.545273-110.923202a221.750422 221.750422 0 0 1 7.998501 55.669562c0.031994 1.151784 0.223958 2.303568 0.223958 3.487347v0.095982a221.110542 221.110542 0 0 1-7.358621 56.405424 21.691933 21.691933 0 0 0 7.774543 23.259638l41.528213 30.554271 4.991064 3.647317-35.353371 61.268512-5.662938-2.495532-46.647254-20.444167a21.691933 21.691933 0 0 0-24.187465 5.055052 226.421546 226.421546 0 0 1-44.407673 34.777479c-1.695682 1.023808-3.391364 2.143598-5.11904 3.103418a222.230332 222.230332 0 0 1-52.37418 21.308005 21.723927 21.723927 0 0 0-16.412923 18.396551l-5.662938 50.742486-0.543898 5.11904h-70.706743l-0.607886-5.374992-5.662938-50.870462a21.723927 21.723927 0 0 0-16.220958-18.364557 224.181966 224.181966 0 0 1-52.630132-22.011873l-4.575142-2.815472a226.517528 226.517528 0 0 1-44.023746-34.841467 21.723927 21.723927 0 0 0-24.251453-5.11904l-46.455289 20.380179-6.206837 2.71949-35.353371-61.236518 5.75892-4.255203 41.592202-30.586265a21.691933 21.691933 0 0 0 7.870524-23.131663 221.49447 221.49447 0 0 1-7.03868-55.189651c0-0.63988 0.095982-1.215772 0.095982-1.823659 0-0.735862 0.095982-1.43973 0.127976-2.175592a222.102356 222.102356 0 0 1 8.094482-55.605574 21.723927 21.723927 0 0 0-7.67856-23.547584l-41.240268-30.298319-7.166656-5.279011 35.353371-61.236518 9.022309 3.935262 47.287133 20.732113a21.659939 21.659939 0 0 0 23.899519-4.767106 224.277948 224.277948 0 0 1 45.207524-34.233581l0.063988-0.543898 0.511904 0.223958a223.670062 223.670062 0 0 1 51.990252-21.563957 21.691933 21.691933 0 0 0 16.284946-18.332563l5.630944-50.870462 1.151784-10.142098h70.706743l1.11979 10.142098 5.630944 50.870462a21.691933 21.691933 0 0 0 16.316941 18.332563 223.510092 223.510092 0 0 1 52.470162 21.883897l0.063988-0.031994v0.063988a223.89402 223.89402 0 0 1 45.559457 34.553521 21.691933 21.691933 0 0 0 23.931513 4.7991l47.223146-20.700119 8.31844-3.647316 35.321377 61.268512-6.590764 4.831095-41.272261 30.394301a21.691933 21.691933 0 0 0-7.678561 23.51559zM120.969478 201.594201h420.785103v63.988002H120.969478zM120.969478 403.540336h180.062239v63.988002H120.969478zM120.969478 605.486471h193.371743v63.988003H120.969478z"
-                  fill="#1296db"
-                  p-id="1686"></path>
-              </svg>
-            </p>
-            <h3 style="padding-bottom: 10px" class="props-item_title">
-              生产管理
-            </h3>
-            <p class="description">
-              生产单、交货单、财务核算一体化, 全流程日志，方便追溯和分析,
-              精准跟踪发货进度，支持分批发货。
-            </p>
-          </div>
-        </div>
-        <div class="product-pros-item">
-          <div class="grid-content">
-            <p>
-              <svg
-                t="1657187494059"
-                class="icon"
-                viewBox="0 0 1024 1024"
-                version="1.1"
-                xmlns="http://www.w3.org/2000/svg"
-                p-id="5411"
-                width="32"
-                height="32">
-                <path
-                  d="M835.734065 564.106749V188.035583c0-11.386599-9.276422-20.892843-20.746593-20.892842H731.269852v83.446013C731.269852 273.738023 712.675222 292.499796 689.672202 292.499796H313.204072C290.242838 292.499796 271.627315 273.758916 271.627315 250.588754V167.142741H187.909695C176.62756 167.142741 167.163103 176.502734 167.163103 188.035583v710.356647c0 11.386599 9.276422 20.892843 20.746592 20.892843H480.555741a41.785685 41.785685 0 1 1 0 83.57137H125.314739A41.827471 41.827471 0 0 1 83.591732 960.966294V125.46152A41.785685 41.785685 0 0 1 125.314739 83.57137H271.627315V41.911042C271.627315 18.761773 290.221945 0 313.224965 0H689.693095C712.654329 0 731.269852 18.74088 731.269852 41.911042V83.57137h146.312576C900.627234 83.57137 919.305435 102.354036 919.305435 125.46152V564.106749a41.785685 41.785685 0 0 1-83.57137 0zM355.198686 104.255284v83.989228c0 11.261242 9.401779 20.683914 21.039092 20.683914h250.421611A20.851057 20.851057 0 0 0 647.698482 188.244512V104.255284c0-11.261242-9.401779-20.683914-21.039093-20.683914H376.237778A20.851057 20.851057 0 0 0 355.198686 104.255284zM229.84163 438.749694a41.785685 41.785685 0 0 1 41.723007-41.785685h459.767893c23.044805 0 41.723007 18.552844 41.723007 41.785685a41.785685 41.785685 0 0 1-41.723007 41.785685H271.564637A41.660328 41.660328 0 0 1 229.84163 438.749694z m0 334.285481c0-23.086591 18.845344-41.785685 41.973721-41.785685h166.766669a41.785685 41.785685 0 1 1 0 83.57137H271.836244A41.785685 41.785685 0 0 1 229.84163 773.035175z m0-167.14274c0-23.086591 18.657308-41.785685 41.618543-41.785686h230.155553c22.982127 0 41.618542 18.552844 41.618543 41.785686 0 23.086591-18.657308 41.785685-41.618543 41.785685H271.460173C248.478046 647.67812 229.84163 629.125275 229.84163 605.892435z m694.373623 176.816126c8.795887 0 16.045703 7.208031 15.983025 16.087489v32.133192a16.087489 16.087489 0 0 1-16.045704 16.087489h-19.304986c-8.795887 0-18.176773 6.894638-20.851057 15.335346l-11.052314 26.909981c-4.157676 7.79303-2.465355 19.325879 3.760712 25.551947l13.705705 13.663919c6.267853 6.267853 6.267853 16.484453 0 22.752305l-22.773199 22.731413a16.087489 16.087489 0 0 1-22.71052 0l-13.622133-13.684812c-6.24696-6.226067-17.758916-7.918387-25.572839-3.718926l-26.909981 11.073207c-8.419816 2.611605-15.356239 11.992492-15.35624 20.830164v19.221415a16.150167 16.150167 0 0 1-16.087488 16.066596h-32.133192a16.129274 16.129274 0 0 1-16.087489-16.066596v-19.221415c0-8.837672-6.894638-18.218559-15.356239-20.830164l-26.951767-11.073207c-7.79303-4.199461-19.284094-2.507141-25.489268 3.718926l-13.705705 13.684812a16.087489 16.087489 0 0 1-22.71052 0l-22.752305-22.731413a16.129274 16.129274 0 0 1 0-22.752305l13.684811-13.663919c6.267853-6.226067 7.93928-17.758916 3.781605-25.551947l-11.114992-26.909981c-2.632498-8.440708-11.992492-15.335346-20.830164-15.377132h-19.284094a16.087489 16.087489 0 0 1-16.087489-16.066596v-32.112299c0-8.879458 7.228924-16.087489 16.087489-16.087489h19.284094c8.837672 0 18.239452-6.894638 20.851057-15.335346l11.094099-26.951767c4.178569-7.813923 2.486248-19.284094-3.781605-25.551947l-13.663919-13.705704a16.087489 16.087489 0 0 1 0-22.71052l22.731413-22.71052c6.24696-6.267853 16.484453-6.267853 22.71052 0l13.726598 13.684812c6.267853 6.226067 17.696238 7.93928 25.489268 3.760711l26.930874-11.03142c8.461601-2.632498 15.356239-11.992492 15.356239-20.892843v-19.284094c0-8.837672 7.249816-16.087489 16.087489-16.087488h32.133192c8.81678 0 16.087489 7.249816 16.087488 16.087488v19.284094c0 8.858565 6.936424 18.239452 15.35624 20.851057l26.868195 11.073206c7.813923 4.178569 19.325879 2.465355 25.551947-3.760711l13.705704-13.663919a16.087489 16.087489 0 0 1 22.731413 0l22.773198 22.731412c6.267853 6.226067 6.267853 16.442667 0 22.731413l-13.705704 13.684812c-6.24696 6.24696-7.93928 17.738023-3.760712 25.510161l11.052314 26.951767c2.653391 8.440708 12.013384 15.335346 20.830164 15.335346h19.346772z m-113.970456 30.712479a80.353873 80.353873 0 1 0-160.728638 0 80.353873 80.353873 0 0 0 80.374765 80.353872 80.33298 80.33298 0 0 0 80.353873-80.332979z"
-                  p-id="5412"
-                  fill="#1296db"></path>
-              </svg>
-            </p>
-            <h3 style="padding-bottom: 10px" class="props-item_title">
-              订单管理
-            </h3>
-            <p class="description">
-              多平台订单实时同步, 订单批量审核，一键拆分、合并订单,
-              自动派单，扫码自动打印物流面单。
-            </p>
-          </div>
-        </div>
-        <div class="product-pros-item">
-          <div class="grid-content">
-            <p>
-              <svg
-                t="1657187693598"
-                class="icon"
-                viewBox="0 0 1024 1024"
-                version="1.1"
-                xmlns="http://www.w3.org/2000/svg"
-                p-id="8608"
-                width="32"
-                height="32">
-                <path
-                  d="M941.8 429.4L547 83.7c-22.8-20-57.2-20-80 0L72.2 429.4C56 443.6 50.5 465.7 58 485.9 65.6 506 84.4 519 105.9 519H149v442.2h716V519h43.1c21.5 0 40.3-13 47.9-33.1 7.5-20.2 2-42.3-14.2-56.5zM801 897.2H213V519.3h588v377.9zM213 519v-63.7h588V519H213z m652-64H140.1L507 133.8 873.9 455H865z"
-                  p-id="8609"
-                  fill="#1296db"></path>
-                <path
-                  d="M358.4 685.9h-76.1c-14 0-25.4-11.4-25.4-25.4v-76.1c0-14 11.4-25.4 25.4-25.4h76.1c14 0 25.4 11.4 25.4 25.4v76.1c0 14-11.4 25.4-25.4 25.4z m-61.4-40h46.8v-46.8H297v46.8zM358.4 847.4h-76.1c-14 0-25.4-11.4-25.4-25.4v-76.1c0-14 11.4-25.4 25.4-25.4h76.1c14 0 25.4 11.4 25.4 25.4V822c0 14-11.4 25.4-25.4 25.4z m-61.4-40h46.8v-46.8H297v46.8zM546 847.4h-76c-14 0-25.4-11.4-25.4-25.4v-76.1c0-14 11.4-25.4 25.4-25.4h76c14 0 25.4 11.4 25.4 25.4V822c0 14-11.4 25.4-25.4 25.4z m-61.4-40h46.8v-46.8h-46.8v46.8z"
-                  p-id="8610"
-                  fill="#1296db"></path>
-              </svg>
-            </p>
-            <h3 style="padding-bottom: 10px" class="props-item_title">
-              仓储管理
-            </h3>
-            <p class="description">
-              规划最优拣货路径，提升仓库作业效率,
-              线上线下、多平台、多店铺库存实时同步, 数据化管理，进销存清晰明了。
-            </p>
-          </div>
-        </div>
-        <div class="product-pros-item">
-          <div class="grid-content">
-            <p>
-              <svg
-                t="1657249105110"
-                class="icon"
-                viewBox="0 0 1024 1024"
-                version="1.1"
-                xmlns="http://www.w3.org/2000/svg"
-                p-id="1631"
-                width="32"
-                height="32">
-                <path
-                  d="M979.2 1017.6H89.6c-44.8 0-83.2-38.4-83.2-83.2V51.2C6.4 32 25.6 12.8 44.8 12.8s38.4 19.2 38.4 38.4v889.6l896 6.4c19.2 0 38.4 19.2 38.4 38.4s-19.2 32-38.4 32z"
-                  p-id="1632"
-                  fill="#1296db"></path>
-                <path
-                  d="M179.2 832v-128c0-19.2 19.2-38.4 38.4-38.4s38.4 19.2 38.4 38.4v128c0 19.2-19.2 38.4-38.4 38.4s-38.4-12.8-38.4-38.4zM377.6 832V601.6c0-19.2 19.2-38.4 38.4-38.4s38.4 19.2 38.4 38.4V832c0 19.2-19.2 38.4-38.4 38.4-25.6 0-38.4-12.8-38.4-38.4zM569.6 832v-128c0-19.2 19.2-38.4 38.4-38.4s38.4 19.2 38.4 38.4v128c0 19.2-19.2 38.4-38.4 38.4s-38.4-12.8-38.4-38.4zM768 832v-192c0-19.2 19.2-38.4 38.4-38.4s38.4 19.2 38.4 38.4v192c0 19.2-19.2 38.4-38.4 38.4s-38.4-12.8-38.4-38.4zM800 102.4h-140.8c-19.2 0-38.4 19.2-38.4 38.4s19.2 38.4 38.4 38.4h57.6L531.2 364.8 460.8 294.4c-12.8-19.2-38.4-19.2-57.6-6.4L192 505.6c-12.8 12.8-12.8 38.4 0 51.2 12.8 19.2 38.4 19.2 51.2 0l185.6-185.6 64 64 6.4 6.4V448c12.8 12.8 38.4 12.8 51.2 0L768 236.8v57.6c0 19.2 19.2 38.4 38.4 38.4s38.4-19.2 38.4-38.4V147.2c0-19.2-19.2-44.8-44.8-44.8z"
-                  p-id="1633"
-                  fill="#1296db"></path>
-              </svg>
-            </p>
-            <h3 style="padding-bottom: 10px" class="props-item_title">
-              报表分析
-            </h3>
-            <p class="description">
-              多维度利润分析，精准掌握店铺状态, 图表结合，数据准确清晰可视化,
-              开发业绩统计让公司管理有数据可循。
-            </p>
-          </div>
-        </div>
-        <div class="product-pros-item">
-          <div class="grid-content">
-            <p>
-              <svg
-                t="1657249168080"
-                class="icon"
-                viewBox="0 0 1024 1024"
-                version="1.1"
-                xmlns="http://www.w3.org/2000/svg"
-                p-id="3100"
-                width="32"
-                height="32">
-                <path
-                  d="M971.1 338.4l-108.5-97.1c-11-9.9-25.2-15.3-40-15.3H644.8v-58c0-33.1-26.9-60-60-60H94.2c-33.1 0-60 26.9-60 60v639.8h91.2c15.4 56.3 66.9 97.8 128.1 97.8s112.7-41.5 128.1-97.8H665c15.4 56.3 66.9 97.8 128.1 97.8s112.7-41.5 128.1-97.8h70.1V383.1c-0.2-17.1-7.5-33.3-20.2-44.7zM317.3 807.8c-12.4 22.5-36.3 37.8-63.8 37.8s-51.4-15.3-63.8-37.8c-5.7-10.4-8.9-22.2-8.9-34.9 0-8.8 1.6-17.3 4.5-25.1 10.2-27.8 37-47.6 68.2-47.6s58 19.8 68.2 47.6c2.9 7.8 4.5 16.3 4.5 25.1 0 12.7-3.3 24.5-8.9 34.9z m267.5-60h-201c-11.8-61.2-65.7-107.6-130.3-107.6s-118.6 46.4-130.3 107.6h-29V168h490.6v579.8z m271.9 60c-12.4 22.5-36.3 37.8-63.8 37.8s-51.4-15.3-63.8-37.8c-5.7-10.4-8.9-22.2-8.9-34.9 0-8.8 1.6-17.3 4.5-25.1 10.2-27.8 37-47.6 68.2-47.6s58 19.8 68.2 47.6c2.9 7.8 4.5 16.3 4.5 25.1 0.1 12.7-3.2 24.5-8.9 34.9z m74.4-60h-7.8c-11.8-61.2-65.7-107.6-130.3-107.6s-118.6 46.4-130.3 107.6h-16.1V286h176.1l108.5 97.1v364.7z"
-                  p-id="3101"
-                  fill="#1296db"></path>
-                <path
-                  d="M486.8 340H183.4c-14.3 0-25.8-13.4-25.8-30s11.6-30 25.8-30h303.4c14.3 0 25.8 13.4 25.8 30s-11.5 30-25.8 30zM486.8 468.1H229.9c-14.3 0-25.8-13.4-25.8-30s11.6-30 25.8-30h256.9c14.3 0 25.8 13.4 25.8 30s-11.5 30-25.8 30zM486.8 596.1H323.5c-14.3 0-25.8-13.4-25.8-30s11.6-30 25.8-30h163.3c14.3 0 25.8 13.4 25.8 30s-11.5 30-25.8 30z"
-                  p-id="3102"
-                  fill="#1296db"></path>
-              </svg>
-            </p>
-            <h3 style="padding-bottom: 10px" class="props-item_title">
-              物流管理
-            </h3>
-            <p class="description">
-              支持自定义规则进行物流商自动匹配, 支持根据包裹重量查询物流方式,
-              物流轨迹实时查询，全程跟踪包裹状态。
-            </p>
-          </div>
-        </div>
-        <div class="product-pros-item">
-          <div class="grid-content">
-            <p>
-              <svg
-                t="1657249261244"
-                class="icon"
-                viewBox="0 0 1024 1024"
-                version="1.1"
-                xmlns="http://www.w3.org/2000/svg"
-                p-id="6408"
-                width="32"
-                height="32">
-                <path
-                  d="M767.845 292c50.126 0 94.956 48.341 104.672 106.717l16.912 101.614c2.449 14.709-7.491 28.618-22.2 31.066-14.71 2.448-28.619-7.491-31.067-22.2L819.25 407.582c-5.697-34.228-30.303-61.042-50.785-61.575l-0.62-0.008H246.853c-20.397 0-45.15 26.472-51.226 60.548l-0.179 1.035-73.847 443.7c-4.964 29.821 13.44 52.264 42.604 52.71l0.887 0.007h342.257c14.912 0 27 12.088 27 27 0 14.763-11.848 26.758-26.553 27H165.092c-62.62 0-106.334-51.706-97.056-113.701l0.297-1.882 73.848-443.7c9.619-57.792 53.653-105.75 103.17-106.703l1.502-0.014h520.992z"
-                  p-id="6409"
-                  fill="#1296db"></path>
-                <path
-                  d="M512 67c106.231 0 192.264 82.24 193.974 184l0.026 3.09v232.454c0 14.06-12.088 25.456-27 25.456-14.763 0-26.758-11.17-26.996-25.035l-0.004-0.42V254.09c0-75.357-62.841-136.179-140-136.179-76.387 0-138.742 59.612-139.981 133.923L372 254.09v232.454c0 14.06-12.088 25.456-27 25.456-14.763 0-26.758-11.17-27-25.035V254.09C318 150.91 404.696 67 512 67z"
-                  p-id="6410"
-                  fill="#1296db"></path>
-                <path
-                  d="M761.998 677C715.13 677 677 715.134 677 762.002 677 808.87 715.13 847 761.998 847 808.87 847 847 808.87 847 762.002 846.996 715.13 808.866 677 761.998 677z m-0.284 136.397C733.2 813.397 710 790.206 710 761.7S733.199 710 761.714 710c28.516 0 51.714 23.192 51.714 51.699 0 28.507-23.198 51.698-51.714 51.698z m186.066-25.484l-25.74-14.858c0.577-5.666 0.867-11.359 0.868-17.055 0-5.686-0.292-11.4-0.868-17.055l25.74-14.858c9.762-5.635 13.121-18.16 7.484-27.919l-47.55-82.336c-5.636-9.76-18.165-13.113-27.927-7.482l-25.74 14.857a165.852 165.852 0 0 0-29.55-17.087v-29.683c0-11.27-9.17-20.437-20.448-20.437h-95.1c-11.273 0-20.443 9.17-20.443 20.437v29.687a166.13 166.13 0 0 0-29.55 17.087l-25.744-14.857c-9.762-5.635-22.29-2.281-27.928 7.482l-47.55 82.332c-5.636 9.76-2.277 22.284 7.485 27.92l25.74 14.857a168.537 168.537 0 0 0-0.868 17.055c0 5.682 0.292 11.4 0.869 17.055l-25.741 14.858c-9.762 5.635-13.121 18.16-7.484 27.923l47.55 82.332c5.636 9.763 18.165 13.117 27.927 7.482l25.745-14.857a166.212 166.212 0 0 0 29.55 17.083v29.687c0 11.27 9.17 20.437 20.443 20.437h95.1c11.273 0 20.447-9.17 20.447-20.437v-29.687a166.352 166.352 0 0 0 29.55-17.083l25.74 14.857c9.766 5.635 22.295 2.281 27.928-7.482l47.55-82.332c5.636-9.763 2.281-22.284-7.485-27.923z m-78.468 73.917l-20.335-11.756c-6.215-3.59-13.891-3.085-19.558 1.291a119.278 119.278 0 0 1-27.36 15.847c-6.607 2.73-10.879 9.131-10.879 16.306V907h-69.367v-23.482c0-7.175-4.268-13.576-10.875-16.306a119.402 119.402 0 0 1-27.36-15.847c-5.667-4.376-13.346-4.884-19.558-1.291l-20.335 11.756L609 801.669l20.328-11.753a17.593 17.593 0 0 0 8.666-17.575 121.135 121.135 0 0 1-1.038-15.843c0-5.293 0.35-10.624 1.038-15.843a17.584 17.584 0 0 0-8.666-17.574L609 711.328l34.685-60.161 20.335 11.756c6.212 3.593 13.887 3.085 19.558-1.292a119.402 119.402 0 0 1 27.36-15.846c6.607-2.73 10.879-9.132 10.879-16.307V606h69.37v23.478c0 7.175 4.268 13.576 10.878 16.307a119.35 119.35 0 0 1 27.36 15.846c5.668 4.373 13.343 4.881 19.555 1.292l20.335-11.756L904 711.328l-20.328 11.753a17.595 17.595 0 0 0-8.666 17.578 121.096 121.096 0 0 1 1.038 15.843c0 5.293-0.347 10.62-1.038 15.843a17.582 17.582 0 0 0 8.666 17.574L904 801.672l-34.688 60.158z"
-                  p-id="6411"
-                  fill="#1296db"></path>
-              </svg>
-            </p>
-            <h3 style="padding-bottom: 10px" class="props-item_title">
-              商品管理
-            </h3>
-            <p class="description">
-              支持绑定主商品，销售、生产、采购一体化, 一键导入店铺，同步供应,
-              智能缺货预警，自动计算补货数量。
-            </p>
-          </div>
-        </div>
-        <div class="product-pros-item">
-          <div class="grid-content">
-            <p>
-              <svg
-                t="1657249329454"
-                class="icon"
-                viewBox="0 0 1024 1024"
-                version="1.1"
-                xmlns="http://www.w3.org/2000/svg"
-                p-id="11455"
-                width="32"
-                height="32">
-                <path
-                  d="M846.706821 660.494313a40.958387 40.958387 0 0 1-19.199244-5.119798 35.198614 35.198614 0 0 1-15.359395-22.399118 32.638715 32.638715 0 0 1 4.479823-25.598992 341.746544 341.746544 0 0 0 56.317783-188.792567A356.465964 356.465964 0 0 0 512 67.877647a356.465964 356.465964 0 0 0-360.945788 350.706191 35.838589 35.838589 0 0 1-35.838589 35.198614 35.838589 35.838589 0 0 1-35.838588-34.558639A426.863192 426.863192 0 0 1 512 0.040318a426.863192 426.863192 0 0 1 432.622965 420.463445 409.583873 409.583873 0 0 1-63.99748 225.27113 36.478564 36.478564 0 0 1-30.71879 15.99937zM990.061176 1024a32.638715 32.638715 0 0 0 32.638715-31.99874v-181.752844a31.99874 31.99874 0 0 0-26.238967-30.71879A988.761068 988.761068 0 0 1 767.98992 691.853078a247.030273 247.030273 0 0 0-127.99496-51.837959 63.99748 63.99748 0 0 0-57.597732 30.078816 82.556749 82.556749 0 0 0 0 79.356875c5.759773 8.959647 15.99937 24.319042 30.718791 45.438211l8.319672 10.879572h-12.799496c-269.429391-16.639345-316.787526-76.796976-370.54541-145.914255a673.893465 673.893465 0 0 0-56.317782-63.99748 170.873272 170.873272 0 0 0-106.235817-57.597732 63.99748 63.99748 0 0 0-55.677808 29.438841A183.032793 183.032793 0 0 0 11.539706 704.0126a520.939488 520.939488 0 0 0 188.792566 223.99118A629.095229 629.095229 0 0 0 384.00504 1011.840479 268.789416 268.789416 0 0 0 448.00252 1024h543.978581zM512 960.00252a622.055507 622.055507 0 0 1-116.475414-10.239597 499.82032 499.82032 0 0 1-324.467224-267.509467 54.397858 54.397858 0 0 1 0-30.71879 30.71879 30.71879 0 0 1 28.798866-32.638715 30.71879 30.71879 0 0 1 12.799496 0c3.199874 0 3.199874 0 24.319043 19.839219a588.776817 588.776817 0 0 1 49.918034 56.957757c63.99748 84.476674 127.99496 164.473524 500.460294 174.073146a29.438841 29.438841 0 0 0 27.518917-16.639345 30.078816 30.078816 0 0 0 0-32.638715c-16.639345-22.399118-54.397858-77.436951-54.397858-78.076925-7.039723-10.239597-8.959647-17.27932-5.759773-23.039093a10.239597 10.239597 0 0 1 10.879571-6.399748 35.838589 35.838589 0 0 1 15.359395 4.479823 344.946418 344.946418 0 0 1 49.27806 24.959018l15.99937 8.319672A1055.318447 1055.318447 0 0 0 952.302663 832.00756h5.119798v127.99496z"
-                  p-id="11456"
-                  fill="#1296db"></path>
-                <path
-                  d="M512 640.015119a26.878942 26.878942 0 0 0 29.438841-23.039092V519.059882h107.515766a30.078816 30.078816 0 0 0 0-60.157631H541.438841v-47.99811h107.515766a30.078816 30.078816 0 0 0 0-59.517657H542.078816L639.99496 248.350541a31.358765 31.358765 0 0 0 0-42.238337 28.158891 28.158891 0 0 0-21.119168-8.319672 26.878942 26.878942 0 0 0-20.479194 8.319672L512 296.988626 423.043503 206.112204a29.438841 29.438841 0 1 0-39.038463 42.238337l97.916144 103.035943H375.045393a30.078816 30.078816 0 0 0 0 59.517657h107.515766v47.99811H375.045393a30.078816 30.078816 0 0 0 0 60.157631h107.515766v94.716271A26.878942 26.878942 0 0 0 512 640.015119z"
-                  p-id="11457"
-                  fill="#1296db"></path>
-              </svg>
-            </p>
-            <h3 style="padding-bottom: 10px" class="props-item_title">
-              财务管理
-            </h3>
-            <p class="description">
-              物流、广告、采购等多维度对账，提高财务工作效率,
-              放款双重审核，安全有保障, 降低管理、运营、产品成本，加快资金流转。
-            </p>
-          </div>
-        </div>
-        <div class="product-pros-item">
-          <div class="grid-content">
-            <p>
-              <svg
-                t="1657249385534"
-                class="icon"
-                viewBox="0 0 1024 1024"
-                version="1.1"
-                xmlns="http://www.w3.org/2000/svg"
-                p-id="14746"
-                width="32"
-                height="32">
-                <path
-                  d="M503.160681 869.8819 213.232452 869.8819c-13.924127 0-25.64917-12.992919-25.64917-28.398794L187.583283 462.622406c2.676969 0.164752 5.373381 0.258896 8.090259 0.258896 43.022862 0 81.295538-21.11797 105.353466-53.728692 24.040533 32.629141 62.313208 53.764508 105.353466 53.764508 43.022862 0 81.278141-21.11797 105.33607-53.711296 24.040533 32.646538 62.330604 53.7993 105.370863 53.7993 42.971697 0 81.20958-21.065781 105.267509-53.572126 24.040533 32.750915 62.348 53.973262 105.439424 53.973262 72.618924 0 131.692345-59.901275 131.692345-133.578298 0-1.344624-0.103354-2.625804-0.291642-3.954055L924.07722 88.534406c-1.938142-13.117762-13.015432-22.64372-26.047236-22.64372L125.437897 65.890686c-13.031804 0-24.109094 9.525957-26.047236 22.64372L64.272839 325.780785c-0.188288 1.327228-0.291642 2.65548-0.291642 4.000104 0 51.127448 28.667923 95.601358 70.607104 117.887944l0 393.814274c0 44.768623 35.929304 82.381266 78.643128 82.381266l289.928229 0c14.541181 0 26.337855-12.17939 26.337855-26.990724C529.498536 882.06129 517.701862 869.8819 503.160681 869.8819zM148.107199 118.723985l727.254505 0 31.43085 212.698287c-0.994654 43.231617-36.043914 78.322833-78.998215 78.322833-43.571355 0-79.015611-36.227086-79.015611-80.751139 0-14.812357-11.797697-26.830065-26.338878-26.830065-14.541181 0-26.337855 12.017708-26.337855 26.830065 0 44.296879-35.443233 80.348979-79.015611 80.348979s-79.015611-36.122709-79.015611-80.541361c0-14.812357-11.797697-26.830065-26.338878-26.830065-14.541181 0-26.337855 12.015661-26.337855 26.828019 0 44.366464-35.443233 80.450287-79.015611 80.450287s-79.015611-36.128849-79.015611-80.513732c0-14.812357-11.797697-26.843368-26.337855-26.843368-14.541181 0-26.337855 11.989055-26.337855 26.801413 0 44.366464-35.443233 80.414471-79.015611 80.414471-42.954301 0-78.003562-34.751478-78.998215-77.685313L148.107199 118.723985z"
-                  p-id="14747"
-                  fill="#1296db"></path>
-                <path
-                  d="M930.130076 703.43603c16.324804-21.083178 18.365276-49.732681 5.178953-72.982198l-10.957563-19.360953c-12.929474-22.776749-37.929868-35.43914-63.444984-32.102139l-20.268626 2.571568c-13.374612 1.711991-25.669636-5.964852-30.196743-17.668405l-8.075933-24.559349c-10.18599-26.375717-34.689057-45.031613-59.58712-45.031613l-20.936845 0c-24.915459 0-49.435922 18.673292-59.759035 45.502333l-7.476275 21.345144c-4.989641 12.925381-17.696034 20.995173-31.139208 19.230993l-19.256576-2.235924c-25.961278-3.580548-50.996464 9.152451-64.114227 32.401967l-10.957563 19.546172c-13.066597 23.178909-11.059893 51.754734 5.126764 72.785723l12.346189 16.034185c8.247848 10.707876 8.247848 25.65838-0.017396 36.383652l-12.226462 15.841803c-16.255219 21.065781-18.261922 49.674353-5.126764 72.888054l10.425444 18.405185c13.237489 23.301705 39.627533 36.075637 65.657372 31.761378l18.639522-3.080152c13.323447-2.218528 26.252921 5.123694 31.962969 19.254529l6.189979 12.134365c9.328459 23.26589 31.483038 36.966936 59.278081 36.966936l21.828145 0c27.813462 0 49.967018-13.701047 59.003835-36.356023l7.184633-16.006556c4.88731-12.19167 17.678638-19.336394 30.762631-17.187451l19.581987 3.476171c26.166963 4.139274 51.801806-8.244778 65.005526-31.458479l10.425444-18.165732c13.254885-23.301705 11.248182-51.982932-5.110391-73.083505l-11.917424-15.35471c-8.299013-10.725272-8.299013-25.730011 0-36.437887L930.130076 703.43603zM904.83804 825.758983l-10.425444 18.162662c-5.933129 10.444886-17.198707 16.010649-28.979008 14.159488l-19.581987-3.488451c-29.664623-4.558829-57.924247 11.416004-68.692498 38.33305l-7.184633 16.159028c-5.178953 12.942777-18.98233 14.780635-26.750247 14.780635l-21.828145 0c-7.767917 0-21.571295-1.836835-27.367301-16.160051l-6.189979-12.125155c-9.996678-24.943089-33.402761-40.593534-59.072397-40.593534-3.429099 0-6.910387 0.279363-10.408047 0.855484l-18.639522 3.056616c-11.711739 2.026146-23.662933-3.825119-29.630854-14.340613l-10.425444-18.410302c-5.933129-10.463306-5.024433-23.388686 2.314719-32.908504l12.226462-15.842827c18.296715-23.702841 18.313088-56.8201 0.051165-80.557734l-12.346189-16.033162c-7.30436-9.502421-8.214079-22.406313-2.297322-32.921807l10.957563-19.537985c5.966898-10.532891 17.216103-16.229636 29.305443-14.674211l19.273972 2.266623c28.532847 3.894703 57.340963-13.510712 68.314898-42.051745l7.476275-20.977777c4.852518-12.593829 16.427134-21.850657 26.903743-21.850657l20.936845 0c10.476609 0 22.027689 9.256828 26.589588 21.012569l8.069793 24.173562c10.717086 27.789926 38.448684 44.558845 67.565838 40.872896l20.243043-2.602268c11.608386-1.502213 22.773679 4.227278 28.586059 14.480806l10.858302 19.35379c0 0 0 0 0 0.017396 5.637394 10.480702 5.140067 23.406083-2.232854 32.908504l-11.869329 15.458063c-18.399045 23.772426-18.399045 56.977689 0 80.767512l11.93482 15.370059C909.896242 802.372344 910.788565 815.314097 904.83804 825.758983z"
-                  p-id="14748"
-                  fill="#1296db"></path>
-                <path
-                  d="M732.301452 646.5136c-47.429219 0-86.028329 39.318494-86.028329 87.650269 0 48.314379 38.59911 87.632873 86.028329 87.632873 47.446615 0 86.045725-39.318494 86.045725-87.632873C818.346153 685.833117 779.748067 646.5136 732.301452 646.5136zM732.301452 786.025027c-28.070312 0-50.910507-23.26589-50.910507-51.860135 0-28.611641 22.840194-51.877531 50.910507-51.877531 28.087709 0 50.927903 23.266913 50.927903 51.877531C783.228331 762.758114 760.388137 786.025027 732.301452 786.025027z"
-                  p-id="14749"
-                  fill="#1296db"></path>
-              </svg>
-            </p>
-            <h3 style="padding-bottom: 10px" class="props-item_title">
-              店铺管理
-            </h3>
-            <p class="description">
-              多平台、多店铺统一管理, 支持多店铺之间导入商品,
-              支持商品一键发布下架。
-            </p>
-          </div>
-        </div> -->
        <div class="product-pros-tabs">
          <div
            class="tab-item"
@@ -273,12 +17,13 @@
        <div class="product-pros-contents">
          <div class="tab-pane" v-show="activeTab === 0">
            <div class="tab-pane_top">
-              <img src="../assets/images/solution-bg.png" />
              <span class="text">
                智能分析采购需求，不同类型的采购形式配置，同时合理管控供应商及整个采购流程，每一个环节都清晰明了
              </span>
              <div class="free-btn">
-                <el-button type="primary" size="small" @click="freeTrial">免费试用</el-button>
+                <el-button type="primary" size="small" @click="freeTrial">
+                  免费试用
+                </el-button>
              </div>
            </div>
            <div class="tab-pane_bottom">
@@ -334,12 +79,13 @@
          </div>
          <div class="tab-pane" v-show="activeTab === 1">
            <div class="tab-pane_top">
-              <img src="../assets/images/solution-bg.png" />
              <span class="text">
                系统智能化实现自动分仓、自动审单、标记发货及监控、发货超时提醒，多种订单状态满足客户日常处理订单的所有需求
              </span>
              <div class="free-btn">
-                <el-button type="primary" size="small" @click="freeTrial">免费试用</el-button>
+                <el-button type="primary" size="small" @click="freeTrial">
+                  免费试用
+                </el-button>
              </div>
            </div>
            <div class="tab-pane_bottom">
@@ -349,9 +95,7 @@
                    <span>同步订单</span>
                  </div>
                  <div class="item-des">
-                    <span>
+                    <span>系统自动抓取平台上的订单到客户订单页面</span>
-                      系统自动抓取平台上的订单到客户订单页面
-                    </span>
                  </div>
                </div>
                <div class="row-item">
@@ -359,7 +103,9 @@
                    <span>智能发货</span>
                  </div>
                  <div class="item-des">
-                    <span>FBA库存不足时，对库存现有的商品数先发货，再去采购不足商品</span>
+                    <span>
+                      FBA库存不足时，对库存现有的商品数先发货，再去采购不足商品
+                    </span>
                  </div>
                </div>
                <div class="row-item">
@@ -384,12 +130,13 @@
          </div>
          <div class="tab-pane" v-show="activeTab === 2">
            <div class="tab-pane_top">
-              <img src="../assets/images/solution-bg.png" />
              <span class="text">
                智能高效的仓储管理系统，集收货、入库、出库等库内作业为一体，对信息、资源更完美的管理
              </span>
              <div class="free-btn">
-                <el-button type="primary" size="small" @click="freeTrial">免费试用</el-button>
+                <el-button type="primary" size="small" @click="freeTrial">
+                  免费试用
+                </el-button>
              </div>
            </div>
            <div class="tab-pane_bottom">
@@ -399,9 +146,7 @@
                    <span>提升效率</span>
                  </div>
                  <div class="item-des">
-                    <span>
+                    <span>规划最优拣货路径，提升仓库作业效率；</span>
-                      规划最优拣货路径，提升仓库作业效率；
-                    </span>
                  </div>
                </div>
                <div class="row-item">
@@ -425,12 +170,13 @@
          </div>
          <div class="tab-pane" v-show="activeTab === 3">
            <div class="tab-pane_top">
-              <img src="../assets/images/solution-bg.png" />
              <span class="text">
                强大的数据中心，能够精准、快速地分析出各个维度、环节的利润、成本、支出。
              </span>
              <div class="free-btn">
-                <el-button type="primary" size="small" @click="freeTrial">免费试用</el-button>
+                <el-button type="primary" size="small" @click="freeTrial">
+                  免费试用
+                </el-button>
              </div>
            </div>
            <div class="tab-pane_bottom">
@@ -440,9 +186,7 @@
                    <span>订单利润报表</span>
                  </div>
                  <div class="item-des">
-                    <span>
+                    <span>多维度利润分析，精准掌握店铺状态</span>
-                      多维度利润分析，精准掌握店铺状态
-                    </span>
                  </div>
                </div>
                <div class="row-item">
@@ -466,12 +210,13 @@
          </div>
          <div class="tab-pane" v-show="activeTab === 4">
            <div class="tab-pane_top">
-              <img src="../assets/images/solution-bg.png" />
              <span class="text">
                通过订单审核策略自动匹配运输方式、发货仓，运费试算。包裹物流轨迹追踪，精准掌握包裹状态信息，提高效率，减少损失
              </span>
              <div class="free-btn">
-                <el-button type="primary" size="small" @click="freeTrial">免费试用</el-button>
+                <el-button type="primary" size="small" @click="freeTrial">
+                  免费试用
+                </el-button>
              </div>
            </div>
            <div class="tab-pane_bottom">
@@ -481,9 +226,7 @@
                    <span>自定义申报规则</span>
                  </div>
                  <div class="item-des">
-                    <span>
+                    <span>自定义申报报关信息，按需快速申报，避免高昂关税</span>
-                      自定义申报报关信息，按需快速申报，避免高昂关税
-                    </span>
                  </div>
                </div>
                <div class="row-item">
@@ -491,7 +234,9 @@
                    <span>包裹物流轨迹</span>
                  </div>
                  <div class="item-des">
-                    <span>物流轨迹状态实时跟踪，实现包裹一站式查询与异常提醒</span>
+                    <span>
+                      物流轨迹状态实时跟踪，实现包裹一站式查询与异常提醒
+                    </span>
                  </div>
                </div>
                <div class="row-item">
@@ -507,12 +252,13 @@
          </div>
          <div class="tab-pane" v-show="activeTab === 5">
            <div class="tab-pane_top">
-              <img src="../assets/images/solution-bg.png" />
              <span class="text">
                管理所有产品信息，精细到每一张图片、每一个标题，并且实现快速批量刊登
              </span>
              <div class="free-btn">
-                <el-button type="primary" size="small" @click="freeTrial">免费试用</el-button>
+                <el-button type="primary" size="small" @click="freeTrial">
+                  免费试用
+                </el-button>
              </div>
            </div>
            <div class="tab-pane_bottom">
@@ -522,9 +268,7 @@
                    <span>一体化</span>
                  </div>
                  <div class="item-des">
-                    <span>
+                    <span>支持绑定主商品，销售、生产、采购一体化</span>
-                      支持绑定主商品，销售、生产、采购一体化
-                    </span>
                  </div>
                </div>
                <div class="row-item">
@@ -548,12 +292,13 @@
          </div>
          <div class="tab-pane" v-show="activeTab === 6">
            <div class="tab-pane_top">
-              <img src="../assets/images/solution-bg.png" />
              <span class="text">
                采用精准严谨的财务管理流程，算清每一分钱的来龙去脉，实时掌握公司资金流
              </span>
              <div class="free-btn">
-                <el-button type="primary" size="small" @click="freeTrial">免费试用</el-button>
+                <el-button type="primary" size="small" @click="freeTrial">
+                  免费试用
+                </el-button>
              </div>
            </div>
            <div class="tab-pane_bottom">
@@ -563,9 +308,7 @@
                    <span>多维度对账</span>
                  </div>
                  <div class="item-des">
-                    <span>
+                    <span>物流、广告、采购等多维度对账，提高财务工作效率</span>
-                      物流、广告、采购等多维度对账，提高财务工作效率
-                    </span>
                  </div>
                </div>
                <div class="row-item">
@@ -589,12 +332,11 @@
          </div>
          <div class="tab-pane" v-show="activeTab === 7">
            <div class="tab-pane_top">
-              <img src="../assets/images/solution-bg.png" />
+              <span class="text">多店铺统一管理，高效快捷，一键刊登和下架</span>
-              <span class="text">
-                多店铺统一管理，高效快捷，一键刊登和下架
-              </span>
              <div class="free-btn">
-                <el-button type="primary" size="small" @click="freeTrial">免费试用</el-button>
+                <el-button type="primary" size="small" @click="freeTrial">
+                  免费试用
+                </el-button>
              </div>
            </div>
            <div class="tab-pane_bottom">
@@ -604,9 +346,7 @@
                    <span>统计管理</span>
                  </div>
                  <div class="item-des">
-                    <span>
+                    <span>多平台、多店铺统一管理</span>
-                      多平台、多店铺统一管理
-                    </span>
                  </div>
                </div>
                <div class="row-item">
@@ -660,11 +400,11 @@ export default {
    },
    freeTrial() {
      window.open('https://demo.jomalls.com')
-    }
+    },
  },
 }
 </script>
-<style scoped>
+<style scoped lang="scss">
 .product-intro {
  padding: 100px 0;
 }
@@ -733,19 +473,11 @@ export default {
 .tab-pane_top {
  width: 100%;
-  height: 140px;
+  padding: 40px 40px 20px;
-  position: relative;
+  background-image: url('~@/assets/images/solution-bg.png'),
-}
+    linear-gradient(to right, #f3f5f7 0%, #edeff2);
+  background-size: 100% auto;
-.tab-pane_top img {
+  background-repeat: no-repeat;
-  height: 100%;
-  width: 100%;
-}
-.tab-pane_top span {
-  position: absolute;
-  top: 40px;
-  left: 50px;
 }
 .tab-item.active span {
@@ -753,9 +485,7 @@ export default {
 }
 .free-btn {
-  position: absolute;
+  margin-top: 10px;
-  top: 90px;
-  left: 50px;
 }
 .product-pros-contents {
@@ -819,4 +549,65 @@ export default {
  font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto,
    Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
 }
+@media screen and (max-width: 1100px) {
+  .function_bg {
+    width: 90vw;
+  }
+  .product-pros {
+    flex-direction: column;
+  }
+  .product-intro {
+    padding: 40px 0;
+  }
+  .product-pros-tabs {
+    display: flex;
+    overflow: auto hidden;
+    width: unset;
+    .tab-item {
+      flex-shrink: 0;
+      white-space: nowrap;
+      padding-left: 10px;
+      padding-right: 10px;
+      border-left: none;
+    }
+  }
+  .product-pros-contents {
+    margin-left: 0;
+  }
+  .tab-item-name {
+    font-size: 14px;
+  }
+  .tab-item.active .tab-item-name {
+    font-size: 16px;
+  }
+  .tab-item i {
+    font-size: 20px;
+  }
+  .tab-pane_top {
+    padding: 20px 20px 10px;
+  }
+  .tab-pane_top {
+    & span {
+      font-size: 14px;
+    }
+  }
+  .item-text {
+    font-size: 14px;
+  }
+  .item-des {
+    font-size: 12px;
+  }
+}
 </style>
--- a/src/main.js
+++ b/src/main.js
@@ -17,6 +17,7 @@ import router from './router'
 import './assets/css/root.css'
 import './assets/css/common.css'
 import './assets/css/index.css'
+import './styles/index.scss'
 import moment from 'moment'
 import { filePath, zImgPath } from './utils/axios'
 import './mork'
@@ -24,6 +25,12 @@ import _ from 'lodash'
 Vue.config.performance = true
 Vue.config.productionTip = process.env.NODE_ENV !== 'production'
+const isMobile = () => window.innerWidth <= 1100
+Vue.util.defineReactive(Vue.prototype, '$isMobile', isMobile())
+window.addEventListener('resize', () => {
+  Vue.prototype.$isMobile = isMobile()
+})
 // 待优化
 Vue.prototype.$moment = moment
 // 待优化

--- a/src/styles/index.scss
+++ b/src/styles/index.scss
+:root {
+  --primary-color:#f19240;
+}
\ No newline at end of file
--- a/src/views/aboutus/aboutPage.vue
+++ b/src/views/aboutus/aboutPage.vue
@@ -139,4 +139,42 @@ export default {
  background: url(../../assets/images/banner-icon-04.png);
  background-size: 100% 100%;
 }
+@media screen and (max-width: 1100px) {
+  .image {
+    height: 33vw !important;
+  }
+  .text h2 {
+    font-size: 20px !important;
+  }
+  .text hr {
+    width: 80vw !important;
+    margin: 10px auto !important;
+  }
+  .text ul li:not(:last-child) {
+    margin-right: 20px !important;
+  }
+  .text li i {
+    width: 16px !important;
+    height: 16px !important;
+  }
+  .text li span {
+    font-size: 12px !important;
+    line-height: 16px !important;
+  }
+  .content-body {
+    margin-top: 20px;
+    height: calc(100vh - 33vw - 60px);
+  }
+  .jomals-description {
+    width: 100vw;
+    padding: 0 20px;
+    font-size: 16px;
+  }
+}
 </style>
--- a/src/views/demand/demandPage.vue
+++ b/src/views/demand/demandPage.vue
 <template>
  <div class="demand-page">
    <div ref="headerBanner" class="header-banner">
-      <!-- <div class="image">
-        <img
-          src="../../assets/images/function/function.png"
-          style="width: 100%; height: 100%; object-fit: cover" />
-      </div> -->
      <div class="image">
        <img
          src="../../assets/images/banner-solution.jpg"
@@ -56,7 +51,7 @@
          </div>
          <div class="t-row-2">
            <div class="card-inner">
-              <div class="card-inner-content">
+              <div class="card-inner-content" :style="$isMobile ? 'flex-direction:column-reverse' : ''">
                <div class="left content-text-wrap">
                  <div class="content-text">
                    <h4>高效采购生产</h4>
@@ -98,7 +93,7 @@
              <h4 style="text-align: center">
                各仓库库存状况一目了然，解决库存难管理问题
              </h4>
-              <div class="card-inner-content">
+              <div class="card-inner-content" >
                <div class="left">
                  <img src="../../assets/images/warehouse/kc.png" />
                </div>
@@ -115,7 +110,7 @@
          </div>
          <div class="t-row-2">
            <div class="card-inner">
-              <div class="card-inner-content">
+              <div class="card-inner-content" :style="$isMobile ? 'flex-direction:column-reverse' : ''">
                <div class="left content-text-wrap">
                  <div class="content-text">
                    <h4>订单占用明细</h4>
@@ -174,7 +169,7 @@
          </div>
          <div class="t-row-2">
            <div class="card-inner">
-              <div class="card-inner-content">
+              <div class="card-inner-content" :style="$isMobile ? 'flex-direction:column-reverse' : ''">
                <div class="left content-text-wrap">
                  <div class="content-text">
                    <h4>跨部门高效协同合作</h4>
@@ -229,7 +224,7 @@
          </div>
          <div class="t-row-2">
            <div class="card-inner">
-              <div class="card-inner-content">
+              <div class="card-inner-content" :style="$isMobile ? 'flex-direction:column-reverse' : ''">
                <div class="left content-text-wrap">
                  <div class="content-text">
                    <h4>一体化管理</h4>
@@ -259,7 +254,7 @@
          </div>
          <div class="t-row-4">
            <div class="card-inner">
-              <div class="card-inner-content">
+              <div class="card-inner-content" :style="$isMobile ? 'flex-direction:column-reverse' : ''">
                <div class="left content-text-wrap">
                  <div class="content-text">
                    <h4>操作日志</h4>
@@ -295,7 +290,7 @@
          </div>
          <div class="t-row-2">
            <div class="card-inner">
-              <div class="card-inner-content">
+              <div class="card-inner-content" :style="$isMobile ? 'flex-direction:column-reverse' : ''">
                <div class="left content-text-wrap">
                  <div class="content-text">
                    <h4>分批发货</h4>
@@ -350,7 +345,7 @@
          </div>
          <div class="t-row-2">
            <div class="card-inner">
-              <div class="card-inner-content">
+              <div class="card-inner-content" :style="$isMobile ? 'flex-direction:column-reverse' : ''">
                <div class="left content-text-wrap">
                  <div class="content-text">
                    <h4>打单、验货以及称重一体化进行</h4>
@@ -382,7 +377,7 @@
          </div>
          <div class="t-row-4">
            <div class="card-inner">
-              <div class="card-inner-content">
+              <div class="card-inner-content" :style="$isMobile ? 'flex-direction:column-reverse' : ''">
                <div class="left content-text-wrap">
                  <div class="content-text">
                    <h4>多站点库存数据打通</h4>
@@ -404,13 +399,13 @@
                  <img src="../../assets/images/fh/wl.png" />
                </div>
                <div class="right content-text-wrap">
-                  <div class="content-text" style="margin-left: 40px">
+                  <div class="content-text" :style="$isMobile ? 'margin-left: 0' : 'margin-left: 40px'">
                    <h4
-                      style="
+                      :style="`
-                        font-size: 32px;
+                        ${$isMobile ? 'font-size: 22px' : 'font-size: 32px'}
                        font-weight: 100;
                        margin: 0;
-                      ">
+                      `">
                      物流管理
                    </h4>
                    <h5 style="font-size: 14px; margin-bottom: 16px; margin-top: 6px; font-weight: 100;">
@@ -452,7 +447,7 @@
          </div>
          <div class="t-row-2">
            <div class="card-inner">
-              <div class="card-inner-content">
+              <div class="card-inner-content" :style="$isMobile ? 'flex-direction:column-reverse' : ''">
                <div class="left content-text-wrap">
                  <div class="content-text">
                    <h4>跟踪号</h4>
@@ -526,15 +521,16 @@ export default {
    },
    onChangePane(index) {
      this.active = index
+      if (this.$isMobile) return
      this.scrollParent().scrollTo({
        behavior: 'smooth',
-        top: this.$refs.headerBanner.offsetHeight - 60,
+        top: this.$refs.headerBanner.offsetHeight - 0,
      })
    },
  },
 }
 </script>
-<style scoped>
+<style scoped lang="scss">
 .header-banner {
  position: relative;
 }
@@ -699,4 +695,97 @@ export default {
 .card-inner-content .content-text .text-des p {
  margin-bottom: 12px;
 }
+@media screen and (max-width:1100px) {
+  .text {
+    top: 20px !important;
+    left: 20px !important;
+    right: 20px !important;
+  }
+  .text h2 {
+    font-size: 20px !important;
+    margin-bottom: 10px !important;
+  }
+  .text p {
+    font-size: 12px !important;
+  }
+  .feature-list {
+    width: unset;
+    overflow-x: auto;
+    font-size: 14px;
+    transform: unset;
+    position: unset;
+    border-radius: 0;
+  }
+  .feature-item {
+    padding: 10px;
+    white-space: nowrap;
+    flex-shrink: 0;
+  }
+  .card-inner {
+    width: 100vw;
+    h3 {
+      font-size: 24px !important;
+    }
+    h4 {
+      font-size: 14px;
+      margin-bottom: 40px;
+    }
+  }
+  .card-inner-content {
+    flex-direction: column;
+    padding: 0 20px;
+    align-items: flex-start;
+  }
+  .t-row-1 {
+    padding-top: 40px;
+    padding-bottom: 50px;
+  }
+  .content-text-wrap {
+    margin-top: 20px;
+  }
+  .card-inner-content .content-text h4 {
+    line-height: 28px;
+    font-size: 22px;
+    text-align: left !important;
+  }
+  .card-inner-content .content-text p {
+    margin-bottom: 0px;
+    line-height: 12px;
+    font-size: 12px;
+    text-align: left !important;
+  }
+  .t-row-2 .t2 {
+    width: 100px;
+    left: 20px;
+    top: 80px;
+  }
+  .t-row-2 .t3 {
+    width: 70px;
+    left: 240px;
+    top: 75px;
+  }
+  .t-row-2 {
+    padding: 40px 0;
+  }
+  .t-row-3 {
+    padding: 40px 0;
+  }
+}
 </style>
--- a/src/views/function/functionPage.vue
+++ b/src/views/function/functionPage.vue
@@ -30,9 +30,9 @@
                </div>
                <div class="right content-text-wrap">
                  <div class="content-text">
-                    <h4 style="text-align: center">图文定制</h4>
+                    <h4 :style="$isMobile ? 'text-align:left' : 'text-align: center'">图文定制</h4>
                    <div class="text-des">
-                      <p style="text-align: center">
+                      <p :style="$isMobile ? 'text-align:left;font-size:14px' : 'text-align: center'">
                        支持客户图文定制，自动抓取客户设计的成品图和设计图
                      </p>
                    </div>
@@ -43,7 +43,7 @@
          </div>
          <div class="t-row-2">
            <div class="card-inner">
-              <div class="card-inner-content">
+              <div class="card-inner-content" :style="$isMobile ? 'flex-direction: column-reverse;align-items: flex-start;' : ''">
                <div class="left content-text-wrap">
                  <div class="content-text">
                    <h4>订单流程</h4>
@@ -66,9 +66,9 @@
                </div>
                <div class="right content-text-wrap">
                  <div class="content-text">
-                    <h4 style="text-align: center">方便快捷出单、装箱</h4>
+                    <h4 :style="$isMobile ? 'text-align:left' : 'text-align: center'">方便快捷出单、装箱</h4>
                    <div class="text-des">
-                      <p style="text-align: center">
+                      <p :style="$isMobile ? 'text-align:left;font-size:14px' : 'text-align: center'">
                        生产完成扫码，单件直接出面单，多件放入周转箱等待配齐
                      </p>
                    </div>
@@ -91,8 +91,8 @@
                </div>
                <div class="right content-text-wrap">
                  <div class="content-text">
-                    <h4 style="text-align: center">一键创建生产单</h4>
+                    <h4 :style="$isMobile ? 'text-align:left' : 'text-align: center'">一键创建生产单</h4>
-                    <div class="text-des text-des-2" style="margin-left:0">
+                    <div class="text-des text-des-2" style="margin-left: 0">
                      <p style="text-align: center">
                        操作简单明了，一健创建生产单
                      </p>
@@ -104,11 +104,11 @@
          </div>
          <div class="t-row-2">
            <div class="card-inner">
-              <div class="card-inner-content">
+              <div class="card-inner-content" :style="$isMobile ? 'flex-direction: column-reverse' : ''">
                <div class="left content-text-wrap">
                  <div class="content-text">
                    <h4>批量发货一步到位</h4>
-                    <div class="text-des" style="margin-left:0">
+                    <div class="text-des" style="margin-left: 0">
                      <p>分配供应商，打印生产单，拣胚贴码</p>
                      <p>工厂下载生产图进行压烫</p>
                      <p>扫码验货进行生产完成，批量发货</p>
@@ -135,7 +135,7 @@
                </div>
                <div class="right content-text-wrap">
                  <div class="content-text">
-                    <h4 style="text-align: center">
+                    <h4 :style="$isMobile ? 'text-align:left' : 'text-align: center'">
                      根据库存和销量，自动下单给供应商
                    </h4>
                    <div class="text-des">
@@ -160,22 +160,20 @@
              <h3 style="text-align: center; font-size: 32px; font-weight: 100">
                精准可视化决策系统
              </h3>
-              <h4 style="text-align: center">实时统计报表数据，洞察业务数据变化</h4>
+              <h4 style="text-align: center">
-              <div class="card-inner-content">
+                实时统计报表数据，洞察业务数据变化
+              </h4>
+              <div class="card-inner-content" :style="$isMobile ? 'flex-direction: column-reverse' : ''">
                <div class="left">
                  <div class="content-text">
-                    <h4>
+                    <h4>精准高效决策</h4>
-                      精准高效决策
-                    </h4>
                    <div class="text-des" style="margin-left: 0">
-                      <p>
+                      <p>订单处理、店铺发货报表数据分析，业务情况了如指掌</p>
-                        订单处理、店铺发货报表数据分析，业务情况了如指掌
-                      </p>
                      <p>产品销售报表数据分析，让公司管理有数据可循</p>
+                      <p>利润统计、开发业绩统计报表分析，更懂您的利润</p>
                      <p>
-                        利润统计、开发业绩统计报表分析，更懂您的利润
+                        物流费用和物流状态报表数据分析，为降低产品成本提供依据
                      </p>
-                      <p>物流费用和物流状态报表数据分析，为降低产品成本提供依据</p>
                    </div>
                  </div>
                </div>
@@ -195,7 +193,7 @@ export default {
  name: 'functionPage',
 }
 </script>
-<style scoped>
+<style scoped lang="scss">
 .header-banner {
  position: relative;
 }
@@ -385,4 +383,66 @@ export default {
 .text-des-2 {
  margin-left: 0;
 }
-</style>
\ No newline at end of file
+@media screen and (max-width: 1100px) {
+  .card-inner {
+    width: 100%;
+    padding: 0 20px;
+  }
+  .card-inner-content {
+    flex-direction: column;
+    align-items: flex-start;
+  }
+  .text {
+    top: 20px;
+    left: 20px;
+    right: 20px;
+    h2 {
+      font-size: 20px;
+    }
+    p {
+      font-size: 12px;
+    }
+  }
+  .t-row-1 {
+    padding-top: 30px;
+    padding-bottom: 40px;
+  }
+  .card-inner h3 {
+    font-size: 24px !important;
+  }
+  .card-inner h4 {
+    margin-bottom: 20px;
+  }
+  .card-inner-content .content-text h4 {
+    font-size: 22px;
+    line-height: 30px;
+  }
+  .t-row-2,
+  .t-row-4,
+  .t-row-3 {
+    padding: 30px 0;
+  }
+  .content-text {
+    margin-top: 40px;
+  }
+  .text-des {
+    margin-left: 0;
+  }
+  .text-des p {
+    margin-bottom: 0;
+    font-size: 14px;
+  }
+}
+</style>
--- a/src/views/home.vue
+++ b/src/views/home.vue
@@ -34,27 +34,6 @@ export default {
    this.$el.removeEventListener('scroll', this.onScroll)
  },
  methods: {
-    submitForm(e) {
-      e.preventDefault()
-      this.$refs.ruleForm.validate((valid) => {
-        if (valid) {
-          const hash = md5.create()
-          hash.update(this.ruleForm.password)
-          const passwordHash = hash.hex()
-          let url = `business/user/login`
-          post(url, {
-            email: this.ruleForm.email,
-            password: passwordHash,
-          }).then((res) => {
-            if (res.code === 200) {
-              this.ruleForm = {}
-              this.$router.push('/contact')
-            }
-          })
-        }
-      })
-    },
    onScroll() {
      const top = this.$el.scrollTop
      if (top === 0) {

--- a/src/views/homePage/index.vue
+++ b/src/views/homePage/index.vue
@@ -4,15 +4,24 @@
      <el-carousel
        class="banner-images-inner"
        :interval="5000"
-        height="33.333vw">
+        arrow="always"
+        :height="$isMobile ? '40vw' : '33.333vw'">
        <el-carousel-item v-for="(item, index) in bannerImages" :key="index">
-          <img class="images" :src="item.image" style="width: 100vw" />
+          <img
+            class="images"
+            :src="item.image"
+            style="width: 100vw; height: 100%; object-fit: cover" />
        </el-carousel-item>
      </el-carousel>
    </div>
    <product-intro />
    <div class="docking-platform">
-      <h2 style="text-align: center; padding: 20px">对接平台</h2>
+      <h2
+        :style="`text-align: center; padding: 20px; font-size: ${
+          $isMobile ? '18px' : '24px'
+        }`">
+        对接平台
+      </h2>
      <div class="platforms">
        <div class="platform-item"><img src="../../assets/logo1.jpg" /></div>
        <div class="platform-item"><img src="../../assets/logo2.jpg" /></div>
@@ -92,13 +101,25 @@ export default {
 @media screen and (max-width: 1440px) {
  .platforms {
-    grid-template-columns: repeat(9, 1fr);
+    grid-template-columns: repeat(6, 1fr);
  }
 }
-@media screen and (max-width: 1000px) {
+@media screen and (max-width: 1100px) {
+  .docking-platform {
+    padding: 0 20px 40px;
+  }
  .platforms {
-    grid-template-columns: repeat(6, 1fr);
+    grid-template-columns: repeat(3, 1fr);
+  }
+  .platform-item {
+    padding: 10px !important;
+  }
+  .home-page::v-deep .el-carousel__indicators {
+    display: none;
  }
 }

--- a/src/views/price/pricePage.vue
+++ b/src/views/price/pricePage.vue
@@ -374,7 +374,7 @@ export default {
  border-right: solid 1px #eee;
 }
 </style>
-<style>
+<style scoped>
 .price-container .fs-20 {
  font-size: 20px;
 }
@@ -420,4 +420,36 @@ export default {
  background-size: 100%;
  background-image: url("data:image/svg+xml,%0A%3Csvg width='23' height='22' viewBox='0 0 23 22' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M16.1735 5.25388L17.2461 6.32649C17.5846 6.66499 17.5846 7.21382 17.2461 7.55233L13.7974 11.0004L17.2461 14.4489C17.5846 14.7874 17.5846 15.3363 17.2461 15.6748L16.1735 16.7474C15.835 17.0859 15.2862 17.0859 14.9477 16.7474L11.4983 13.2974L8.05233 16.7461C7.71382 17.0846 7.16499 17.0846 6.82649 16.7461L5.75388 15.6735C5.41537 15.335 5.41537 14.7862 5.75388 14.4477L9.19907 11.0004L5.75388 7.55358C5.41537 7.21507 5.41537 6.66625 5.75388 6.32774L6.82649 5.25513C7.16499 4.91663 7.71382 4.91663 8.05233 5.25513L11.4983 8.70123L14.9477 5.25388C15.2862 4.91537 15.835 4.91537 16.1735 5.25388Z' fill='%23FF4930'/%3E%3C/svg%3E%0A");
 }
+@media screen and (max-width: 1100px) {
+  .image {
+    height: 33vw !important;
+  }
+  .text h2 {
+    font-size: 20px !important;
+  }
+  .text hr {
+    width: 80vw !important;
+    margin: 10px auto !important;
+  }
+  .text ul li:not(:last-child) {
+    margin-right: 20px !important;
+  }
+  .text li i {
+    width: 16px !important;
+    height: 16px !important;
+  }
+  .text li span {
+    font-size: 12px !important;
+    line-height: 16px !important;
+  }
+  .content-body {
+    padding: 40px 0 !important;
+  }
+}
 </style>
--- a/src/views/register.vue
+++ b/src/views/register.vue
@@ -9,42 +9,46 @@
    </div>
    <div class="login_content">
-      <h2 style="text-align: center;font-weight: 400;color: #4a4c6d;">用户注册</h2>
+      <h2 style="text-align: center; font-weight: 400; color: #4a4c6d">
+        用户注册
+      </h2>
      <el-form
        size="medium"
        :model="registerForm"
        :rules="rules"
        ref="registerForm"
-        :inline="true"
        class="login_form">
        <el-form-item prop="email" label="">
          <el-input
            v-model="registerForm.email"
            prefix-icon="el-icon-postcard"
-            style="width: 300px;"
            placeholder="请输入邮箱"></el-input>
        </el-form-item>
        <el-form-item prop="code" label="">
-          <el-input
+          <div style="display: flex; gap: 20px">
-            v-model="registerForm.code"
+            <div style="flex: 1">
-            style="width: 180px;"
+              <el-input
-            prefix-icon="el-icon-message"
+                v-model="registerForm.code"
-            placeholder="请输入验证码"></el-input>
+                prefix-icon="el-icon-message"
-          <el-button
+                placeholder="请输入验证码"></el-input>
-            class="get-code-button"
+            </div>
-            style="width: 112px"
+            <div>
-            :disabled="getCodeDisabled"
+              <el-button
-            :class="getCodeDisabled ? 'disabled' : 'code-btn'"
+                class="get-code-button"
-            @click="verCode">
+                style="width: 112px"
-            {{ codeCountDown === 0 ? '获取验证码' : `${codeCountDown}秒` }}
+                :disabled="getCodeDisabled"
-          </el-button>
+                :class="getCodeDisabled ? 'disabled' : 'code-btn'"
+                @click="verCode">
+                {{ codeCountDown === 0 ? '获取验证码' : `${codeCountDown}秒` }}
+              </el-button>
+            </div>
+          </div>
        </el-form-item>
        <el-form-item prop="password" label="">
          <el-input
            type="password"
            v-model="registerForm.password"
            prefix-icon="el-icon-lock"
-            style="width: 300px;"
            placeholder="请输入密码"
            autocomplete="off"></el-input>
        </el-form-item>
@@ -53,7 +57,6 @@
            type="password"
            prefix-icon="el-icon-lock"
            v-model="registerForm.checkPass"
-            style="width: 300px;"
            placeholder="请再次输入密码"
            autocomplete="off"></el-input>
        </el-form-item>
@@ -61,14 +64,12 @@
          <el-input
            v-model="registerForm.companyName"
            prefix-icon="el-icon-s-home"
-            style="width: 300px;"
            placeholder="请输入公司名称"></el-input>
        </el-form-item>
        <el-form-item prop="job" label="">
          <el-input
            v-model="registerForm.job"
            prefix-icon="el-icon-s-order"
-            style="width: 300px;"
            placeholder="请输入职务"></el-input>
        </el-form-item>
      </el-form>
@@ -79,7 +80,7 @@
          <a class="link" href="/protocol" target="_blank">九猫ERP条款与协议</a>
        </span>
      </div>
-      <div style="text-align: center; padding: 0 20px">
+      <div style="text-align: center;">
        <button class="register-btn" type="primary" @click="onRegister">
          立即注册
        </button>
@@ -218,14 +219,11 @@ export default {
  margin-right: 0px;
 }
 .login_content {
-  padding: 18px;
+  padding: 40px;
-  background: rgba(255, 255, 255, 0.4);
+  background: #fff;
-  backdrop-filter: blur(10px);
  position: absolute;
  top: 50%;
-  left: 75%;
+  left: 70%;
-  /* height: 600px; */
-  /* width: 600px; */
  border-radius: 6px;
  transform: translate(-50%, -50%);
  box-sizing: border-box;
@@ -238,16 +236,11 @@ export default {
 }
 .login_form {
-  padding: 20px 20px 0px 20px;
+  padding: 20px 0px 0px 0px;
-  border-radius: 6px;
-  display: flex;
-  align-items: center;
-  flex-direction: column;
 }
 .agree-terms {
  margin-bottom: 30px;
-  margin-left: 20px;
 }
 .get-code-button:disabled:hover {
@@ -306,8 +299,7 @@ export default {
 .logo {
  position: absolute;
-  top: 60px;
+  top: 7%;
-  left: 80px;
+  left: 8%;
 }
 </style>