diff --git a/src/components/HeaderTop.vue b/src/components/HeaderTop.vue
index 7a5e6b2..f6ecfaa 100644
--- a/src/components/HeaderTop.vue
+++ b/src/components/HeaderTop.vue
@@ -37,37 +37,41 @@
             @mouseleave="removeActive(1)"
           >
             会员专区<i class="el-icon-arrow-down"></i>
-            <div class="aBsolt" v-show="vipShow">
-              <div
-                v-for="item in zoneList"
-                class="aBsolt_iu"
-                :key="item.value"
-                v-show="item.isShow"
-                @mouseover="childrenActive(item.value)"
-                @mouseleave="childrenRemActive(item.value)"
-                @click="openZone(item)"
-              >
-                <div class="aBsolt_ii">{{ item.label }}</div>
+            <transition name="fade-slide">
+              <div class="aBsolt" v-show="vipShow">
                 <div
-                  class="aBsolt_c"
-                  v-if="
-                    childShow == item.value &&
-                    item.children &&
-                    item.children.length > 0
-                  "
+                  v-for="item in zoneList"
+                  class="aBsolt_iu"
+                  :key="item.value"
+                  v-show="item.isShow"
+                  @mouseover="childrenActive(item.value)"
+                  @mouseleave="childrenRemActive()"
+                  @click="openZone(item)"
                 >
-                  <div
-                    v-for="ctem in item.children"
-                    class="aBsolt_ic"
-                    :key="ctem.value"
-                    v-show="ctem.isShow"
-                    @click.stop="openZone(item, ctem)"
-                  >
-                    {{ ctem.label }}
-                  </div>
+                  <div class="aBsolt_ii">{{ item.label }}</div>
+                  <transition name="fade-slide">
+                    <div
+                      class="aBsolt_c"
+                      v-if="
+                        childShow == item.value &&
+                        item.children &&
+                        item.children.length > 0
+                      "
+                    >
+                      <div
+                        v-for="ctem in item.children"
+                        class="aBsolt_ic"
+                        :key="ctem.value"
+                        v-show="ctem.isShow"
+                        @click.stop="openZone(item, ctem)"
+                      >
+                        {{ ctem.label }}
+                      </div>
+                    </div>
+                  </transition>
                 </div>
               </div>
-            </div>
+            </transition>
           </div>
           <div
             class="fHeigh"
@@ -76,17 +80,19 @@
             @mouseleave="removeActive(2)"
           >
             {{ "市场动态" }} <i class="el-icon-arrow-down"></i>
-            <div class="aBsolt" v-show="marketShow">
-              <div
-                v-for="item in marketList"
-                class="aBsolt_i"
-                :key="item.id"
-                v-show="item.isShow"
-                @click="openPage1(item)"
-              >
-                {{ item.text }}
+            <transition name="fade-slide">
+              <div class="aBsolt" v-show="marketShow">
+                <div
+                  v-for="item in marketList"
+                  class="aBsolt_i"
+                  :key="item.id"
+                  v-show="item.isShow"
+                  @click="openPage1(item)"
+                >
+                  {{ item.text }}
+                </div>
               </div>
-            </div>
+            </transition>
           </div>
           <div
             class="fHeigh"
@@ -95,17 +101,19 @@
             @mouseleave="removeActive(3)"
           >
             {{ "会员中心" }} <i class="el-icon-arrow-down"></i>
-            <div class="aBsolt" v-show="vipcShow">
-              <div
-                v-for="item in vipList"
-                class="aBsolt_i"
-                :key="item.id"
-                v-show="item.isShow"
-                @click="openPage(item)"
-              >
-                {{ item.text }}
+            <transition name="fade-slide">
+              <div class="aBsolt" v-show="vipcShow">
+                <div
+                  v-for="item in vipList"
+                  class="aBsolt_i"
+                  :key="item.id"
+                  v-show="item.isShow"
+                  @click="openPage(item)"
+                >
+                  {{ item.text }}
+                </div>
               </div>
-            </div>
+            </transition>
           </div>
         </div>
         <div class="page_btm_r">
@@ -121,52 +129,54 @@
               </div>
             </div>
             <!-- v-show="memberShow" -->
-            <div
-              class="aBsolts"
-              v-show="memberShow"
-              @mouseover="changeActive(4)"
-              @mouseleave="removeActive(4)"
-            >
-              <div class="aBsolt_i disflex cen" @click="goPersonInfo(1)">
-                <img
-                  class="hImg"
-                  :src="
-                    userInfo.headPath
-                      ? userInfo.headPath
-                      : userInfo.settleCountrySquareIcon
+            <transition name="fade-slide">
+              <div
+                class="aBsolts"
+                v-show="memberShow"
+                @mouseover="changeActive(4)"
+                @mouseleave="removeActive(4)"
+              >
+                <div class="aBsolt_i disflex cen" @click="goPersonInfo(1)">
+                  <img
+                    class="hImg"
+                    :src="
+                      userInfo.headPath
+                        ? userInfo.headPath
+                        : userInfo.settleCountrySquareIcon
+                    "
+                    alt=""
+                  />{{ userInfo.memberName }}
+                </div>
+                <div
+                  style="
+                    width: 170px;
+                    height: 1px;
+                    background-color: #999;
+                    margin: 10px auto;
                   "
-                  alt=""
-                />{{ userInfo.memberName }}
+                ></div>
+                <div class="aBsolt_i" @click="goPersonInfo(0)">
+                  {{ "个人资料" }}
+                </div>
+                <div class="aBsolt_i" @click="goPersonInfo(2)">
+                  {{ "账号安全" }}
+                </div>
+                <div class="aBsolt_i" @click="goPersonInfo(4)">
+                  {{ "地址管理" }}
+                </div>
+                <!-- <div class="aBsolt_i"
+                                         @click="goPersonInfo(3)">商城积分</div> -->
+                <div
+                  style="
+                    width: 170px;
+                    height: 1px;
+                    background-color: #999;
+                    margin: 10px auto;
+                  "
+                ></div>
+                <div class="aBsolt_i" @click="logout">{{ "退出登录" }}</div>
               </div>
-              <div
-                style="
-                  width: 170px;
-                  height: 1px;
-                  background-color: #999;
-                  margin: 10px auto;
-                "
-              ></div>
-              <div class="aBsolt_i" @click="goPersonInfo(0)">
-                {{ "个人资料" }}
-              </div>
-              <div class="aBsolt_i" @click="goPersonInfo(2)">
-                {{ "账号安全" }}
-              </div>
-              <div class="aBsolt_i" @click="goPersonInfo(4)">
-                {{ "地址管理" }}
-              </div>
-              <!-- <div class="aBsolt_i"
-                                       @click="goPersonInfo(3)">商城积分</div> -->
-              <div
-                style="
-                  width: 170px;
-                  height: 1px;
-                  background-color: #999;
-                  margin: 10px auto;
-                "
-              ></div>
-              <div class="aBsolt_i" @click="logout">{{ "退出登录" }}</div>
-            </div>
+            </transition>
           </div>
         </div>
       </div>
@@ -537,7 +547,7 @@ export default {
       this.$set(this, "childShow", id);
       this.$forceUpdate();
     },
-    childrenRemActive(id) {
+    childrenRemActive() {
       this.$set(this, "childShow", 0);
     },
     //鼠标移入
@@ -601,6 +611,22 @@ export default {
   right: 0px;
 }
 
+/* Transition styles */
+.fade-slide-enter-active,
+.fade-slide-leave-active {
+  transition: opacity 0.3s ease, transform 0.3s ease;
+}
+.fade-slide-enter,
+.fade-slide-leave-to {
+  opacity: 0;
+  transform: translateY(-10px);
+}
+.fade-slide-enter-to,
+.fade-slide-leave {
+  opacity: 1;
+  transform: translateY(0);
+}
+
 .size-s {
   font-size: 24px;
   margin-left: 0px;
@@ -625,16 +651,39 @@ export default {
   align-items: center;
   justify-content: space-between;
   font-size: 14px;
-  line-height: 44px;
   padding: 5px 60px;
-  background: #cccccc;
-  color: #333333;
+  background: #ffffff;
+  border-bottom: 1px solid #e9ecef;
 }
 
 .page_top_l {
   flex: 1;
   font-size: 18px;
   color: #333;
+  gap: 30px;
+  height: 44px;
+
+  div {
+    cursor: pointer;
+    color: #4a5568;
+    font-size: 18px;
+    transition: color 0.2s ease-in-out;
+
+    .el-icon-message,
+    .el-icon-chat-dot-round {
+      color: #4a5568;
+      transition: color 0.2s ease-in-out;
+      margin-right: 4px;
+    }
+
+    &:hover {
+      color: var(--primary-color);
+      .el-icon-message,
+      .el-icon-chat-dot-round {
+        color: var(--primary-color);
+      }
+    }
+  }
 }
 
 .page_top_r {
@@ -643,12 +692,30 @@ export default {
   align-items: center;
   justify-content: flex-end;
   gap: 30px;
-  height: 44px;
 
   div {
     cursor: pointer;
-    color: #333;
+    color: #4a5568;
     font-size: 18px;
+    padding: 4px 12px;
+    border-radius: 4px;
+    transition: color 0.2s ease-in-out, background-color 0.2s ease-in-out;
+
+    .el-icon-message,
+    .el-icon-chat-dot-round {
+      color: #4a5568;
+      transition: color 0.2s ease-in-out;
+      margin-right: 4px;
+    }
+
+    &:hover {
+      color: var(--primary-color);
+      background-color: #f8f9fa;
+      .el-icon-message,
+      .el-icon-chat-dot-round {
+        color: var(--primary-color);
+      }
+    }
   }
 }
 
@@ -659,7 +726,7 @@ export default {
   height: 63px;
   font-size: 18px;
   padding: 0 30px;
-  background: rgba(24, 24, 24, 0.84);
+  background: #2d3748;
   color: #ffffff;
 
   .fHeigh {
@@ -667,6 +734,7 @@ export default {
     line-height: 63px;
     cursor: pointer;
     position: relative;
+    transition: transform 0.2s ease-in-out;
   }
 
   .page_btm_l {
@@ -693,6 +761,14 @@ export default {
 
     .page_btm_r1 {
       margin-right: 20px;
+
+      // Styles for the div containing userInfo.memberCode and the caret icon
+      .disflex > div:last-child {
+        font-weight: 600; // Semi-bold for better prominence
+        text-shadow: 0 1px 2px rgba(0, 0, 0, 0.5); // Subtle shadow for depth
+        display: flex; // Ensures text and icon are aligned well
+        align-items: center;
+      }
     }
 
     .page_btm_r2 {
@@ -711,13 +787,13 @@ export default {
   box-shadow: 0px 2px 20px 0px rgba(135, 135, 135, 0.3);
   border-radius: 8px 8px 8px 8px;
   padding: 10px 0; // padding: 10px 36px;
-  transform: translate(-62px, 0);
+  transform: translate(-52px, 0);
   // bottom: 0;
 }
 
 .aBsolts {
   width: 200px;
-  transform: translateX(0);
+  transform: translateX(-10px);
   text-align: center;
   position: absolute;
   color: #333;
@@ -726,7 +802,7 @@ export default {
   box-shadow: 0px 2px 20px 0px rgba(135, 135, 135, 0.3);
   border-radius: 8px 8px 8px 8px;
   padding: 10px 0;
-  margin-left: -30px; // padding: 10px 36px;
+  // margin-left: -30px; // padding: 10px 36px;
   // transform: translate(-72px, 0);
 }
 
@@ -813,7 +889,41 @@ export default {
 .page_btm_c {
   flex: 1;
   padding: 0 40px;
+  padding-right: 80px;
   display: flex;
   justify-content: space-between;
 }
+
+/* New hover effects for main menu items and user menu trigger */
+.page_btm_c > .fHeigh,
+.page_btm_r .page_btm_r1.fHeigh {
+  /* position: relative; is already on .fHeigh via .page_btm .fHeigh */
+}
+
+.page_btm_c > .fHeigh::before,
+.page_btm_r .page_btm_r1.fHeigh::before {
+  content: "";
+  position: absolute;
+  top: 0;
+  left: 50%;
+  height: 100%;
+  width: 0; /* Initial width for animation */
+  background-color: rgba(255, 255, 255, 0.1);
+  opacity: 0; /* Initial opacity for animation */
+  transform: translateX(-50%);
+  transition: width 0.2s ease-in-out, opacity 0.2s ease-in-out;
+  z-index: -1; /* Behind the text */
+  border-radius: 8px; /* Match submenu border-radius */
+}
+
+.page_btm_c > .fHeigh:hover::before,
+.page_btm_r .page_btm_r1.fHeigh:hover::before {
+  width: 200px; /* Target width matching submenus */
+  opacity: 1;
+}
+
+.page_btm_c > .fHeigh:hover,
+.page_btm_r .page_btm_r1.fHeigh:hover {
+  transform: translateY(-2px);
+}
 </style>
diff --git a/src/components/special-area-list/index.vue b/src/components/special-area-list/index.vue
index 4ea404c..97737e8 100644
--- a/src/components/special-area-list/index.vue
+++ b/src/components/special-area-list/index.vue
@@ -102,8 +102,7 @@ export default {
 <style lang="scss" scoped>
 .area-product-list {
   background-color: #ffffff;
-  padding: 20px;
-  padding-top: 0;
+  padding: 0 20px 0;
   border-radius: 8px;
   margin-bottom: 24px;
   position: relative;
@@ -115,10 +114,10 @@ export default {
   display: flex;
   justify-content: space-between;
   align-items: center;
-  margin-bottom: 24px;
+  margin-bottom: 12px;
   position: relative;
-  padding: 20px 0;
-  height: 46px;
+  padding: 10px 0 10px;
+  height: 36px;
   box-sizing: content-box;
 }
 
@@ -166,15 +165,16 @@ export default {
 }
 
 .product-item {
-  width: 20%;
-  padding: 0 10px;
+  width: 33%;
+  padding: 0 10px 8px;
   box-sizing: border-box;
   margin-bottom: 20px;
   cursor: pointer;
+  overflow: hidden;
   transition: transform 0.2s ease, box-shadow 0.2s ease;
   &:hover {
-    transform: translateY(-5px);
-    box-shadow: 0 8px 16px rgba(0, 0, 0, 0.1);
+    transform: translateY(-2px);
+    box-shadow: 0 6px 12px rgba(0, 0, 0, 0.08);
   }
 }
 
@@ -186,6 +186,11 @@ export default {
   background-color: #f5f5f5;
   object-fit: cover;
   display: block;
+  transition: transform 0.3s ease-out;
+}
+
+.product-item:hover .product-image {
+  transform: scale(1.05);
 }
 
 .product-info {
diff --git a/src/router/index.js b/src/router/index.js
index b181337..bca8c79 100644
--- a/src/router/index.js
+++ b/src/router/index.js
@@ -400,15 +400,6 @@ const routes = [
     component: () => import("@/views/login.vue"),
   },
 
-  //成长之路
-  {
-    path: "/roadtoGrowth",
-    name: "RoadtoGrowth",
-    component: () => import("@/views/roadtoGrowth/index.vue"),
-    meta: {
-      keepAlive: true,
-    },
-  },
   //乡村振兴礼包
   {
     path: "/spaceMallList",
diff --git a/src/views/index/components/sidebarUserInfo.vue b/src/views/index/components/sidebarUserInfo.vue
index 3c009e2..77ee78e 100644
--- a/src/views/index/components/sidebarUserInfo.vue
+++ b/src/views/index/components/sidebarUserInfo.vue
@@ -10,24 +10,41 @@
         />
       </div>
       <div class="nameCountry">
-        <div class="username">{{ userInfo.memberName }}</div>
-        <img :src="userInfo.countrySquareIcon" alt="" />
+        <div class="username">{{ userInfo.memberCode }}</div>
+        <div v-if="userExtraInfo.registerAuthorityVal" class="authority-badge">
+          {{ userExtraInfo.registerAuthorityVal }}
+        </div>
+        <!-- <div class="username">{{ userData.registerAuthorityVal }}</div> -->
+        <!-- <img :src="userInfo.countrySquareIcon" alt="" /> -->
       </div>
       <!-- 如果是0表示没有奖衔 只显示等级徽章!-->
-      <div class="gradeClass">
-        <img
-          @error="defaultSrc"
-          v-if="userInfo.gradeIcon || defaultSrc == true"
-          @click="goRouter(1)"
-          :src="userInfo.gradeIcon"
-          alt=""
-        />
-      </div>
-      <div class="honor_wrapper">
-        <div class="honor1">
-          <div class="honor-title-wrapper">
-            <div>荣誉奖衔</div>
-            <div class="honor-title">{{ userInfo.pkAwardsVal }}</div>
+      <div class="user-level-info">
+        <div class="honor_wrapper">
+          <div class="honor1">
+            <div class="honor-title-wrapper">
+              <div>结算等级</div>
+              <div class="honor-title">{{ userInfo.pkGradeVal }}</div>
+            </div>
+          </div>
+        </div>
+        <div class="honor_wrapper">
+          <div class="honor1">
+            <div class="honor-title-wrapper">
+              <div>荣誉奖衔</div>
+              <div
+                class="honor-title"
+                :class="{
+                  'is-empty-awards':
+                    !userInfo.pkAwardsVal || userInfo.pkAwardsVal === '无',
+                }"
+              >
+                {{
+                  userInfo.pkAwardsVal && userInfo.pkAwardsVal !== "无"
+                    ? userInfo.pkAwardsVal
+                    : "无"
+                }}
+              </div>
+            </div>
           </div>
         </div>
       </div>
@@ -147,6 +164,7 @@
 
 <script>
 import * as sid from "@/api/sidebaruserinfo.js";
+import { memberInfo } from "@/api/person.js";
 import { mapGetters } from "vuex";
 import user from "@/store/modules/user";
 export default {
@@ -168,17 +186,24 @@ export default {
       intervalTimer: "",
       toLiveBtn: "",
       isHandImg: true,
+      userExtraInfo: {},
     };
   },
   created() {
     this.countdown();
     this.getUserAwards();
+    this.getMemberInfo();
   },
 
   beforeDestroy() {
     clearInterval(this.intervalTimer);
   },
   methods: {
+    getMemberInfo() {
+      memberInfo().then((res) => {
+        this.userExtraInfo = res.data;
+      });
+    },
     clickTap() {
       this.$router.push({
         path: "/personal",
@@ -319,23 +344,17 @@ export default {
       .username {
         font-size: 22px;
         margin-right: 12px;
-      }
-      img {
-        width: 39px;
-        height: 26px;
+        font-weight: bold;
+        color: #b8860b;
+        text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.15);
       }
     }
-    .gradeClass {
+    .user-level-info {
       display: flex;
       width: 200px;
-      margin-top: 20px;
+      margin-top: 16px;
       align-items: center;
       justify-content: space-around;
-      img {
-        width: 55px;
-        //height: 45px;
-        cursor: pointer;
-      }
     }
   }
   .create-time {
@@ -493,11 +512,71 @@ export default {
 
     .honor-title-wrapper {
       flex: 1;
+      > div:first-child {
+        color: #757575; // Slightly muted color for the label
+        margin-bottom: 2px; // Add some space between label and value
+      }
     }
     .honor-title {
-      font-weight: 600;
-      font-size: 18px;
+      font-weight: 700; // Bolder
+      font-size: 20px; // Larger font size
+      color: #333; // Darker color for prominence
+    }
+    .honor-title.is-empty-awards {
+      font-weight: normal;
+      font-size: 18px; // Slightly smaller or same as original
+      color: #999; // Muted grey color
+      // font-style: italic; // Optional: if italics are desired
     }
   }
 }
+
+.authority-badge {
+  display: inline-block;
+  position: relative; // Needed for pseudo-element positioning
+  padding: 4px 10px;
+  font-size: 13px; // Slightly increased font size
+  font-weight: bold;
+  color: #4a3b31; // Dark brown text color for better contrast
+  background: linear-gradient(
+    135deg,
+    #ffd700,
+    #ffa500
+  ); // Gold to Orange gradient
+  border-radius: 12px;
+  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
+  line-height: normal;
+  overflow: hidden; // Keep the shine effect contained
+  cursor: default; // Optional: change cursor to indicate it's not a button
+}
+
+.authority-badge::before {
+  content: "";
+  position: absolute;
+  top: 0;
+  left: -120%; // Adjusted to ensure the wider shine starts fully off-screen
+  width: 50%; // Width of the shine
+  height: 100%;
+  background: linear-gradient(
+    90deg,
+    transparent,
+    rgba(255, 255, 255, 0.6),
+    // Increased opacity for a more prominent shine
+    transparent
+  );
+  transform: skewX(-25deg); // Angled shine
+  animation: shine 2.5s infinite 1s; // Animation name, duration, iteration, delay
+}
+
+@keyframes shine {
+  0% {
+    left: -120%; // Adjusted to ensure the wider shine starts fully off-screen
+  }
+  50% {
+    left: 120%; // Move across the badge
+  }
+  100% {
+    left: 120%; // Stay off-screen to the right before resetting
+  }
+}
 </style>
diff --git a/src/views/index/index.vue b/src/views/index/index.vue
index 89c60bf..034ea30 100644
--- a/src/views/index/index.vue
+++ b/src/views/index/index.vue
@@ -166,14 +166,20 @@
         </div>
       </div>
 
-      <div style="margin-top: 20px">
-        <specialAreaList
-          v-for="(item, index) in areaGoodsList"
-          :key="index"
-          :list="item.waresList"
-          :title="item.specialAreaName"
-          :specialAreaId="item.specialArea"
-        />
+      <div v-if="areaGoodsList.length > 0" style="margin-top: 15px">
+        <el-row :gutter="20">
+          <el-col
+            :span="12"
+            v-for="(item, index) in areaGoodsList"
+            :key="index"
+          >
+            <specialAreaList
+              :list="item.waresList"
+              :title="item.specialAreaName"
+              :specialAreaId="item.specialArea"
+            />
+          </el-col>
+        </el-row>
       </div>
       <!-- <div style="height: 300px"></div> -->
     </div>
@@ -392,7 +398,7 @@ export default {
               });
               this.dialogVisible = false;
             })
-            .catch((err) => {});
+            .catch(() => {});
         } else {
           return false;
         }
@@ -404,10 +410,10 @@ export default {
         if (valid) {
           this.startTime();
           forgetSms(this.loginObj)
-            .then((res) => {
+            .then(() => {
               // this.bankCode = res.data
             })
-            .catch((err) => {
+            .catch(() => {
               this.beginTime = 0;
             });
         } else {
@@ -426,7 +432,6 @@ export default {
       if (this.isSend) return;
       this.isSend = true;
       this.getSmsCode = this.beginTime + "s后重新发送";
-      let that = this;
       this.timer = setInterval(() => {
         this.beginTime--;
         this.getSmsCode = this.beginTime + "s后重新发送";
@@ -628,13 +633,12 @@ html,
   font-size: 18px;
 }
 .add-target {
-  padding: 20px;
+  padding: 10px 20px;
   box-shadow: 7px 5px 10px 0px rgba(59, 59, 59, 0.14);
   border-radius: 10px 10px 10px 10px;
   background-color: #fff;
-  // height: 580px;
   position: relative;
-  margin-top: 20px;
+  margin-top: 15px;
   width: 1040px;
 }
 .target {
diff --git a/src/views/register/index.vue b/src/views/register/index.vue
index 025d149..cf96253 100644
--- a/src/views/register/index.vue
+++ b/src/views/register/index.vue
@@ -1506,6 +1506,8 @@ export default {
 
 .padRow {
   padding: 0 60px;
+  display: flex;
+  flex-wrap: wrap;
 }
 
 ::v-deep .el-input__suffix {
diff --git a/src/views/roadtoGrowth/index.vue b/src/views/roadtoGrowth/index.vue
deleted file mode 100644
index 649569a..0000000
--- a/src/views/roadtoGrowth/index.vue
+++ /dev/null
@@ -1,329 +0,0 @@
-<template>
-  <div class="page">
-    <div class="toproad">
-      <div class="topimg"><img :src="theData.thisAvatarUrl" alt="" /></div>
-
-      <template v-if="ifindex == 1">
-        <div class="roadtitle" :style="{ color: theData.color }">
-          {{ theData.thisGradeName }}
-        </div>
-        <div class="thecode">{{'全球编码'}} {{ theData.globalCode }}</div>
-        <div class="thecode">{{'国家编码'}} {{ theData.countryCode }}</div>
-        <!-- <div  class="thecode">全球编号 {{ theData.memberCode }}</div>
-        <div class="thepv">累计业绩：{{ theData.achievement }}</div>
-        <div class="themember">
-          尊敬的会员 {{ theData.memberName }} 欢迎您！
-        </div> -->
-      </template>
-      <template v-if="ifindex == 2">
-        <div class="roadtitle">{{ theData.thisAwardsName }}</div>
-        <!-- <div class="thepv">累计业绩：{{ theData.achievement }}</div>
-        <div></div> -->
-      </template>
-    </div>
-      <div class="awards-content" v-if="ifindex==2">
-        <div class="awards-list" v-for="(item,index) in theData.awardsList">
-            <div class="awards-img" v-if="item.image">
-               <img :src="item.image" >
-           </div>
-            <div class="award-name">{{ item.awardsName }}</div>
-<!--            {{item.awardsValue*index}}-->
-            <div class="height" :style="{height:item.awardsValue*index+200+'px',background:item.color}">
-               <div class="price">{{item.communityCheckStr}}PV</div>
-
-                <div class="bottom" :style="{fontSize:item.size}" v-if="item.textContent && index>=5 && item.awardsValue>=15" >{{ item.textContent }}</div>
-                <div class="bottom bottom-s" :style="{fontSize:item.size}" v-if="item.textContent && index<5 && item.awardsValue>=15" >{{ item.textContent }}</div>
-            </div>
-        </div>
-      </div>
-    <div class="echart" id="mychart" v-if="ifindex==1" :style="myChartStyle"></div>
-  </div>
-</template>
-
-<script>
-import * as echarts from "echarts";
-import * as gro from "@/api/wallet.js";
-export default {
-  name: "RoadtoGrowth",
-  data() {
-    return {
-      ifindex: "", //1等级2奖衔
-      thexAxis: [],
-      iconList: [],
-      myChart: {},
-      myChartStyle: {
-        float: "center",
-        width: "1800px",
-        height: "600px",
-        paddingTop: "20px",
-        // margin: "20px",
-      }, //图表样式
-      indexList: [], //高度
-      theData: {},
-      textList:[],
-    };
-  },
-  created() {},
-  mounted() {
-    // this.initEcharts();
-    this.ifindex = this.$route.query.index;
-    this.getList();
-  },
-  methods: {
-    getList() {
-      if (this.$route.query.index == 1) {
-          gro.getGrowUpGrade().then((res) => {
-              if (res.code == 200) {
-                  this.theData = res.data;
-                  res.data.gradeList.forEach((ele) => {
-                      this.thexAxis.push(ele.gradeName);
-                      ele.value = ele.gradeValue;
-                      ele.symbol = "image://" + ele.image;
-                      ele.symbolSize = [90, 80];
-
-                      this.indexList.push(ele.gradeValue);
-                  });
-                  this.iconList = res.data.gradeList;
-                  this.initEcharts();
-              }
-          });
-      } else if (this.$route.query.index == 2) {
-        gro.getGrowUpAwards().then((res) => {
-          if (res.code == 200) {
-            this.theData = res.data;
-            res.data.awardsList.forEach((ele,index) => {
-              if(index==3 || index==4){
-                ele.size = '28px'
-              }
-              if(index>=5){
-                  let size = 24
-                  ele.size = size+(index*2)+'px'
-              }
-              this.thexAxis.push(ele.awardsName);
-              ele.value = ele.awardsValue + 10;
-              ele.symbol = "image://" + ele.image;
-              ele.symbolSize = [110, 80];
-
-              this.indexList.push(ele.awardsValue);
-            });
-            this.iconList = res.data.awardsList;
-          }
-        });
-      }
-    },
-    initEcharts() {
-      const globalIndex = this.$route.query.index;
-      const option = {
-        grid: {
-          // bottom:140,
-          // // 距离左方轴数值
-          // x: 248,
-          // // y:200,
-          // x2: 264,
-          // // 距离下方轴数值
-          // // y2: 120,
-          // containLabel: true,
-        },
-
-        xAxis: {
-          data: this.thexAxis,
-          show: false,
-          axisLine: {
-            lineStyle: {
-              color: "#999",
-              width: 5,
-              fontSize: "18px",
-            },
-          },
-          axisLabel: {
-            padding: [14, 0, 0, 0],
-            fontSize: 14,
-            color: "#000",
-          },
-        },
-        yAxis: {
-          show: false,
-          max: 80,
-        },
-        series: [
-          {
-            type: "bar",
-            barWidth: "100",
-            data: this.iconList,
-            label: {
-              show: true,
-              position: "top",
-              fontSize: 16,
-              color: "#000",
-              formatter: function (params) {
-                // console.log('🌈',params)
-                // var inner =
-                //  params.data.thename)
-                return params.name;
-              },
-            },
-            itemStyle: {
-              normal: {
-                borderRadius: 8,
-
-                color: function (param) {
-                  const color = param.data.color;
-                  return color;
-                },
-              },
-              paddingTop: 20,
-              borderRadius: 8,
-              // color: {
-              //   type: "linear",
-              //   x: 0,
-              //   y: 0,
-              //   x2: 0,
-              //   y2: 1,
-              //   colorStops: [
-              //     {
-              //       offset: 0,
-              //       color: "red", // 0% 处的颜色
-              //     },
-              //     {
-              //       offset: 1,
-              //       color: "yellow", // 100% 处的颜色
-              //     },
-              //   ],
-              //   global: false, // 缺省为 false
-              // },
-            },
-          },
-          {
-            type: "pictorialBar",
-            barGap: "100%",
-            symbolPosition: "end",
-            // symbolSize: 20,
-            symbolOffset: [0, "-150%"],
-            data: this.iconList,
-
-            label: {
-              show: true,
-              position:"insideTop",
-              offset:[0,130],
-              fontSize: 16,
-              color: "#ffffff",
-              align: "center",
-              formatter: function (params) {
-                if (globalIndex == 2) {
-                  var inner =params.data.communityCheckStr ;
-                }
-                if (globalIndex == 1) {
-                  var inner = Number(params.data.startValue);
-                }
-                return inner;
-               
-              },
-            },
-          },
-        ],
-      };
-      const myChart = echarts.init(document.getElementById("mychart"));
-      myChart.setOption(option);
-      //随着屏幕大小调节图表
-      window.addEventListener("resize", () => {
-        myChart.resize();
-      });
-    },
-  },
-};
-</script>
-
-<style lang="scss" scoped>
-.awards-list:nth-child(1){
-  margin-top: 110px !important;
-}
-.bottom-s{
-  color: #fff;
-  width: 50px !important;
-  font-size: 24px !important;
-  bottom: 0;
-}
-.bottom{
-  top: 50%;
-  text-align: center;
-  position: absolute;
-  width: 44px;
-  justify-content: center;
-  color: #fff;
-  align-items: center;
-  display: flex;
-  margin-top: -50px;
-}
-.award-name{
-  text-align: center;
-}
-.height{
-  border-radius: 8px;
-  width: 110px;
-  position: relative;
-  display: flex;
-  justify-content: center;
-  align-items: center;
-  margin-top: 20px;
-}
-.price{
-  position: absolute;
-  top: 20px;
-  color: #fff;
-  font-size: 14px;
-}
-.awards-img{
-  img{
-    width: 124px;
-    height: 109px;
-  }
-}
-.awards-list{
-  margin-left:30px;
-  position: relative;
-  width: 110px;
-  text-align: center;
-}
-.awards-content{
-  display: flex;
-  justify-content: center;
-  margin: 30px 0;
-  position: relative;
-  align-items: end;
-
-}
-.page {
-  padding: 20px;
-  .toproad {
-    text-align: center;
-    background: #fff;
-    padding: 50px 0;
-    .topimg {
-      img {
-        width: 190px;
-        height: 180px;
-      }
-    }
-    .roadtitle {
-      font-size: 32px;
-      font-weight: 500;
-      margin-top: 10px;
-      //   line-height: 34px;
-    }
-    .thecode {
-      font-size: 18px;
-      line-height: 40px;
-      color: #666666;
-    }
-    .thepv {
-      font-size: 14px;
-      margin-top: 10px;
-      //   line-height: 16px;
-    }
-    .themember {
-      margin-top: 20px;
-      font-size: 18px;
-    }
-  }
-}
-</style>
\ No newline at end of file