hookehuyr

修改导航栏为a标签跳转

1 <!-- 1 <!--
2 * @Date: 2024-09-26 13:42:11 2 * @Date: 2024-09-26 13:42:11
3 * @LastEditors: hookehuyr hookehuyr@gmail.com 3 * @LastEditors: hookehuyr hookehuyr@gmail.com
4 - * @LastEditTime: 2024-12-10 16:12:19 4 + * @LastEditTime: 2024-12-11 10:11:23
5 * @FilePath: /hager/src/components/common/hagerHeader.vue 5 * @FilePath: /hager/src/components/common/hagerHeader.vue
6 * @Description: 文件描述 6 * @Description: 文件描述
7 --> 7 -->
...@@ -57,12 +57,18 @@ ...@@ -57,12 +57,18 @@
57 <el-image style="width: auto; height: 0.65rem" src="https://cdn.ipadbiz.cn/hager/icon/%E8%8F%9C%E5%8D%95@2x.png" fit="fit"></el-image>&nbsp; 57 <el-image style="width: auto; height: 0.65rem" src="https://cdn.ipadbiz.cn/hager/icon/%E8%8F%9C%E5%8D%95@2x.png" fit="fit"></el-image>&nbsp;
58 <span @mouseenter="onClickProduct">产品中心</span> 58 <span @mouseenter="onClickProduct">产品中心</span>
59 </div> 59 </div>
60 - <div :class="[is_active === 'solution' ? 'active' : '', 'item']" @click="goTo('/solution/index')">解决方案</div> 60 + <!-- <div :class="[is_active === 'solution' ? 'active' : '', 'item']" @click="goTo('/solution/index')">解决方案</div>
61 <div :class="[is_active === 'news' ? 'active' : '', 'item']" @click="goTo('/news')">新闻中心</div> 61 <div :class="[is_active === 'news' ? 'active' : '', 'item']" @click="goTo('/news')">新闻中心</div>
62 <div :class="[is_active === 'recruit' ? 'active' : '', 'item']" @click="goTo('/recruit')">招聘信息</div> 62 <div :class="[is_active === 'recruit' ? 'active' : '', 'item']" @click="goTo('/recruit')">招聘信息</div>
63 <div :class="[is_active === 'about' ? 'active' : '', 'item']" @click="goTo('/about')">关于海格</div> 63 <div :class="[is_active === 'about' ? 'active' : '', 'item']" @click="goTo('/about')">关于海格</div>
64 <div :class="[is_active === 'contact' ? 'active' : '', 'item']" @click="goTo('/contact')">联系我们</div> 64 <div :class="[is_active === 'contact' ? 'active' : '', 'item']" @click="goTo('/contact')">联系我们</div>
65 - <div :class="[is_active === 'index' ? 'active' : '', 'item']" @click="goTo('/')">首页</div> 65 + <div :class="[is_active === 'index' ? 'active' : '', 'item']" @click="goTo('/')">首页</div> -->
66 + <a :class="[is_active === 'solution' ? 'active' : '', 'item']" :href="`${baseUrl}#/solution/index`" @click="goTo('/solution/index')">解决方案</a>
67 + <a :class="[is_active === 'news' ? 'active' : '', 'item']" :href="`${baseUrl}#/news`" @click="goTo('/news')">新闻中心</a>
68 + <a :class="[is_active === 'recruit' ? 'active' : '', 'item']" :href="`${baseUrl}#/recruit`" @click="goTo('/recruit')">招聘信息</a>
69 + <a :class="[is_active === 'about' ? 'active' : '', 'item']" :href="`${baseUrl}#/about`" @click="goTo('/about')">关于海格</a>
70 + <a :class="[is_active === 'contact' ? 'active' : '', 'item']" :href="`${baseUrl}#/contact`" @click="goTo('/contact')">联系我们</a>
71 + <a :class="[is_active === 'index' ? 'active' : '', 'item']" :href="`${baseUrl}#/`" @click="goTo('/')">首页</a>
66 </div> 72 </div>
67 </el-col> 73 </el-col>
68 </el-row> 74 </el-row>
...@@ -201,6 +207,11 @@ export default { ...@@ -201,6 +207,11 @@ export default {
201 this.$emit('onShowMenu', val) 207 this.$emit('onShowMenu', val)
202 } 208 }
203 }, 209 },
210 + computed: {
211 + baseUrl () {
212 + return location.origin + location.pathname;
213 + }
214 + },
204 async mounted () { 215 async mounted () {
205 const { code, data } = await getProductMenuAPI(); 216 const { code, data } = await getProductMenuAPI();
206 if (code) { 217 if (code) {
...@@ -351,11 +362,11 @@ export default { ...@@ -351,11 +362,11 @@ export default {
351 this.show = false; 362 this.show = false;
352 }, 363 },
353 goTo (path) { // 跳转页面 364 goTo (path) { // 跳转页面
354 - if (this.$route.path !== path) { // 不能重复点击当前页面 365 + // if (this.$route.path !== path) { // 不能重复点击当前页面
355 - this.$router.push({ 366 + // this.$router.push({
356 - path, 367 + // path,
357 - }); 368 + // });
358 - } 369 + // }
359 if (path.indexOf('/solution') === -1) { // 不统计解决方案页面 370 if (path.indexOf('/solution') === -1) { // 不统计解决方案页面
360 // TAG: 统计埋点 371 // TAG: 统计埋点
361 this.maEvent(`h5_${path.slice(1)}`); 372 this.maEvent(`h5_${path.slice(1)}`);
...@@ -568,6 +579,7 @@ export default { ...@@ -568,6 +579,7 @@ export default {
568 // justify-content: space-around; 579 // justify-content: space-around;
569 margin-top: 1.25rem; 580 margin-top: 1.25rem;
570 .item { 581 .item {
582 + text-decoration: none;
571 color: @secondary-color; 583 color: @secondary-color;
572 margin-right: 1.5rem; 584 margin-right: 1.5rem;
573 font-size: 0.95rem; 585 font-size: 0.95rem;
......