Browse Source

合并页面,保证静态页面使用统一tabbar模式

test
wzl 11 months ago
parent
commit
41020fb058
7 changed files with 28 additions and 29 deletions
  1. +2
    -0
      src/components/TopNavBar.vue
  2. +1
    -0
      src/router/router.config.js
  3. +12
    -6
      src/views/Tabbar.vue
  4. +1
    -5
      src/views/optimize/index.vue
  5. +1
    -2
      src/views/optimize/scss/index.scss
  6. +9
    -13
      src/views/today/index.vue
  7. +2
    -3
      src/views/today/scss/index.scss

+ 2
- 0
src/components/TopNavBar.vue View File

@@ -3,6 +3,8 @@
<div class="nav-bar">
<van-nav-bar
:title="title"
:fixed="true"
z-index="998"
@click-left="onClickLeft"
@click-right="onClickRight"
>


+ 1
- 0
src/router/router.config.js View File

@@ -15,6 +15,7 @@ export const constantRouterMap = [
{
path: '/Tabbar',
name: 'Index',
redirect: '/index',
component: () => import('@/views/Tabbar.vue'),
children: [
{


+ 12
- 6
src/views/Tabbar.vue View File

@@ -1,19 +1,22 @@
<!-- -->
<template>
<div>
<!-- nav 组件 -->
<div></div>
<!-- 页面 -->
<router-view />
<!-- 头部导航 -->
<TopNavBar />
<!-- 页面 -->
<div class="tabbar-container">
<router-view />
</div>
<!-- tabbar 组件 -->
<TabBar />
</div>
</template>

<script>
import TopNavBar from '@/components/TopNavBar';
import TabBar from '@/components/TabBar';
export default {
components: { TabBar },
components: { TopNavBar, TabBar },
data() {
return {};
},
@@ -23,7 +26,10 @@ export default {
};
</script>
<style>
.van-tabbar{
.van-tabbar {
z-index: 999 !important;
}
.tabbar-container{
padding:100.06px 0px;
}
</style>

+ 1
- 5
src/views/optimize/index.vue View File

@@ -1,8 +1,6 @@
<!-- -->
<template>
<div class="optimize">
<!-- 头部导航 -->
<TopNavBar />
<!-- 专家介绍 -->
<div class="expert-box">
<van-swipe indicator-color="white">
@@ -136,7 +134,6 @@
<script>
import Vue from 'vue';
import TabBar from '@/components/TabBar';
import TopNavBar from '@/components/TopNavBar';
import expertImage from "@/assets/optimize/images/3_08.png";
import { Swipe, SwipeItem, Lazyload } from 'vant';
Vue.use(Lazyload);
@@ -145,8 +142,7 @@
});
export default {
components: {
TabBar,
TopNavBar,
TabBar,
[Swipe.name]: Swipe,
[SwipeItem.name]: SwipeItem,
[Lazyload.name]: Lazyload,


+ 1
- 2
src/views/optimize/scss/index.scss View File

@@ -1,5 +1,4 @@
.optimize {
padding: 100.06px 0;
background-color: #fff;
min-height: 100vh;
.expert-box {
@@ -266,4 +265,4 @@
}
}
}
}
}

+ 9
- 13
src/views/today/index.vue View File

@@ -1,8 +1,6 @@
<!-- 今日 -->
<template>
<div class="today">
<!-- 头部导航 -->
<TopNavBar />
<!-- 今日状态 -->
<div class="today-status">
<img class="img" src="@/assets/today/images/2_03.png" />
@@ -109,22 +107,22 @@
</li>
</ul>
<div class="annular">
<van-circle
v-model="currentRate1"
<van-circle
v-model="currentRate1"
size="160px"
color="#179b3b"
layer-color="#F8F8F8"
:rate="90"
:speed="50"
:stroke-width="120"
:rate="90"
:speed="50"
:stroke-width="120"
/>
<van-circle
v-model="currentRate2"
<van-circle
v-model="currentRate2"
size="129px"
color="#ff5f8b"
layer-color="#F8F8F8"
:rate="80"
:speed="50"
:rate="80"
:speed="50"
:stroke-width="140"
/>
<p>多走4567步</p>
@@ -209,12 +207,10 @@

<script>
import TabBar from '@/components/TabBar';
import TopNavBar from '@/components/TopNavBar';
import { Calendar, Circle, Checkbox, CheckboxGroup } from 'vant';
export default {
components: {
TabBar,
TopNavBar,
[Circle.name]: Circle,
[Calendar.name]: Calendar,
[Checkbox.name]: Checkbox,


+ 2
- 3
src/views/today/scss/index.scss View File

@@ -1,5 +1,4 @@
.today {
padding: 100.06px 0;
background-color: #fff;
min-height: 100vh;
.today-status {
@@ -227,7 +226,7 @@
}
time {
color: #fff;
font-size: 24px;
font-size: 24px;
display: block;
}
}
@@ -428,4 +427,4 @@
}
}
}
}
}

Loading…
Cancel
Save