tab页面

2 months ago · a2892c67d7
4 changed files with 56 additions and 50 deletions
--- a/epmet-apartment-front/index.html
+++ b/epmet-apartment-front/index.html
@ -9,8 +9,8 @@
    <meta name="description" content="回声 - 专业的网络镜像站点服务提供商，提供高速、稳定、安全的镜像服务">
    <meta name="keywords" content="镜像服务,网络镜像,CDN,高速下载,稳定服务">
    <title>青岛市免租金住房保障平台</title>
-    <script type="module" crossorigin src="/epmet-apartment-front/static/index--uDGezSJ.js"></script>
-    <link rel="stylesheet" crossorigin href="/epmet-apartment-front/static/index-BdtwzmXj.css">
+    <script type="module" crossorigin src="/epmet-apartment-front/static/index-B_OPdPVI.js"></script>
+    <link rel="stylesheet" crossorigin href="/epmet-apartment-front/static/index-XAiPaCqV.css">
  </head>
  <body>
    <div id="app"></div>
--- a/src/components/AppHeader.vue
+++ b/src/components/AppHeader.vue
@ -8,7 +8,7 @@
        <div class="hidden md:flex items-center space-x-8  pl-20">

          <router-link v-for="item in navigationConfig" :key="item.key" :to="item.path"
-            class=" text-white  font-medium transition-colors duration-200"
+            class=" text-white  font-medium transition-colors duration-200" @click.prevent="handleClick(item)"
            :class="{ 'text-yellow-400': $route.path === item.path }">
            {{ item.name }}
          </router-link>
@ -83,7 +83,9 @@
 import { ref, computed, onMounted } from 'vue'
 import { useI18n } from 'vue-i18n'
 import { switchLanguage } from '@/i18n'
-
+import { useRouter, useRoute } from 'vue-router';
+const route = useRoute();
+const router = useRouter();
 const { locale } = useI18n()

 const showMobileMenu = ref(false)
@ -92,12 +94,12 @@ const showLanguageMenu = ref(false)
 const navigationConfig = [
  {
    name: '首页',
-    path: '/',
+    path: '/home',
    key: 'home'
  },
  {
    name: '政策资讯',
-    path: '/policy',
+    path: '/',
    key: 'policy'
  },
  {
@ -107,8 +109,8 @@ const navigationConfig = [
  },
  {
    name: '续期申请',
-    path: '/',
-    key: ''
+    path: '/renewal',
+    key: 'renewal'
  }
 ]
 const currentLanguage = computed(() => locale.value)
@ -129,9 +131,17 @@ const changeLanguage = (lang: string) => {
  switchLanguage(lang)
  showLanguageMenu.value = false
 }
-
+function handleClick(item) {
+  if (item.key === 'home' || item.key === 'renewal') {
+    alert('功能正在开发中')
+    router.push('/')
+  } else {
+    router.push(item.path)
+  }
+}
 onMounted(() => {
 })
+
 </script>

 <style scoped>
--- a/src/router/index.js
+++ b/src/router/index.js
@ -1,32 +1,32 @@
-import { createRouter, createWebHashHistory } from 'vue-router'
-import Home from '../views/Home.vue'
-import Policy from '../views/policy/index.vue'
-import Showings from '../views/showings/index.vue'
-import HouseDetail from '../views/showings/houseDetail.vue'
+import { createRouter, createWebHashHistory } from "vue-router";
+import Home from "../views/Home.vue";
+import Policy from "../views/policy/index.vue";
+import Showings from "../views/showings/index.vue";
+import HouseDetail from "../views/showings/houseDetail.vue";
 const router = createRouter({
  history: createWebHashHistory(import.meta.env.BASE_URL),
  routes: [
    {
-      path: '/',
-      name: 'home',
-      component: Home
+      path: "/home",
+      name: "home",
+      component: Home,
    },
    {
-      path: '/Showings',
-      name: 'Showings',
-      component: Showings
+      path: "/Showings",
+      name: "Showings",
+      component: Showings,
    },
    {
-      path: '/Policy',
-      name: 'Policy',
-      component: Policy
+      path: "/",
+      name: "Policy",
+      component: Policy,
    },
    {
-      path: '/HouseDetail',
-      name: 'HouseDetail',
-      component: HouseDetail
+      path: "/HouseDetail",
+      name: "HouseDetail",
+      component: HouseDetail,
    },
-  ]
-})
+  ],
+});

-export default router
+export default router;
--- a/src/views/showings/houseDetail.vue
+++ b/src/views/showings/houseDetail.vue
@ -3,7 +3,6 @@
    <div class="w-[1310px] mx-auto mt-60px bg-white pb-9 px-6 pt-6 rounded relative">
      <div class="title ">
        <h3 class="font-bold text-2xl">房型详情</h3>
-
      </div>
      <div class="flex w-full pt-2 justify-between divide-x divide-white-100 divide-dashed">
        <div class="w-1/2 pr-10">
@ -154,10 +153,7 @@
        </div> -->
      </div>
    </div>
-    <!-- <div class="flex justify-center align-center">
-      <el-button @click="handerReturn">取消</el-button>
-      <el-button type="primary">选择房型</el-button>
-    </div> -->
+
  </div>
 </template>
 <script setup>