elink-star
/
epmet-asd-pc
12
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
Browse Source

tab页面

master
是小王呀\24601 2 months ago
parent
71b0ff793a
commit
a2892c67d7
4 changed files with 56 additions and 50 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 36
      epmet-apartment-front/index.html
  2. 24
      src/components/AppHeader.vue
  3. 40
      src/router/index.js
  4. 6
      src/views/showings/houseDetail.vue

36
epmet-apartment-front/index.html
View File

@ -1,18 +1,18 @@
<!DOCTYPE html> <!DOCTYPE html>
<html lang=""> <html lang="">
<head> <head>
<meta charset="UTF-8"> <meta charset="UTF-8">
<link rel="icon" href="/favicon.svg" type="image/svg+xml"> <link rel="icon" href="/favicon.svg" type="image/svg+xml">
<link rel="alternate icon" href="/favicon.ico"> <link rel="alternate icon" href="/favicon.ico">
<link rel="apple-touch-icon" href="/favicon.svg"> <link rel="apple-touch-icon" href="/favicon.svg">
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="description" content="回声 - 专业的网络镜像站点服务提供商，提供高速、稳定、安全的镜像服务"> <meta name="description" content="回声 - 专业的网络镜像站点服务提供商，提供高速、稳定、安全的镜像服务">
<meta name="keywords" content="镜像服务,网络镜像,CDN,高速下载,稳定服务"> <meta name="keywords" content="镜像服务,网络镜像,CDN,高速下载,稳定服务">
<title>青岛市免租金住房保障平台</title> <title>青岛市免租金住房保障平台</title>
<script type="module" crossorigin src="/epmet-apartment-front/static/index--uDGezSJ.js"></script> <script type="module" crossorigin src="/epmet-apartment-front/static/index-B_OPdPVI.js"></script>
<link rel="stylesheet" crossorigin href="/epmet-apartment-front/static/index-BdtwzmXj.css"> <link rel="stylesheet" crossorigin href="/epmet-apartment-front/static/index-XAiPaCqV.css">
</head> </head>
<body> <body>
<div id="app"></div> <div id="app"></div>
</body> </body>
</html> </html>

24
src/components/AppHeader.vue
View File

@ -8,7 +8,7 @@
<div class="hidden md:flex items-center space-x-8 pl-20"> <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" <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 }"> :class="{ 'text-yellow-400': $route.path === item.path }">
{{ item.name }} {{ item.name }}
</router-link> </router-link>
@ -83,7 +83,9 @@
import { ref, computed, onMounted } from 'vue' import { ref, computed, onMounted } from 'vue'
import { useI18n } from 'vue-i18n' import { useI18n } from 'vue-i18n'
import { switchLanguage } from '@/i18n' import { switchLanguage } from '@/i18n'
import { useRouter, useRoute } from 'vue-router';
const route = useRoute();
const router = useRouter();
const { locale } = useI18n() const { locale } = useI18n()
const showMobileMenu = ref(false) const showMobileMenu = ref(false)
@ -92,12 +94,12 @@ const showLanguageMenu = ref(false)
const navigationConfig = [ const navigationConfig = [
{ {
name: '首页', name: '首页',
path: '/', path: '/home',
key: 'home' key: 'home'
}, },
{ {
name: '政策资讯', name: '政策资讯',
path: '/policy', path: '/',
key: 'policy' key: 'policy'
}, },
{ {
@ -107,8 +109,8 @@ const navigationConfig = [
}, },
{ {
name: '续期申请', name: '续期申请',
path: '/', path: '/renewal',
key: '' key: 'renewal'
} }
] ]
const currentLanguage = computed(() => locale.value) const currentLanguage = computed(() => locale.value)
@ -129,9 +131,17 @@ const changeLanguage = (lang: string) => {
switchLanguage(lang) switchLanguage(lang)
showLanguageMenu.value = false showLanguageMenu.value = false
} }
function handleClick(item) {
if (item.key === 'home' || item.key === 'renewal') {
alert('功能正在开发中')
router.push('/')
} else {
router.push(item.path)
}
}
onMounted(() => { onMounted(() => {
}) })
</script> </script>
<style scoped> <style scoped>

40
src/router/index.js
View File

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

6
src/views/showings/houseDetail.vue
View File

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

Write Preview
Loading…
Cancel
Save