底部组件添加

master
Lee-1203 2022-03-03 17:38:35 +08:00
parent 9ef6aeeb3e
commit 9bf0d50852
6 changed files with 382 additions and 387 deletions

View File

@ -13,8 +13,8 @@
<span><img src="../assets/images/home/main/evaluation.png" alt=""></span>
<p>测评</p>
</li>
<li :class="{my:true, active:myStyle}" @click="goPage('/my')">
<span><img src="../../../assets/images/home/main/my.png" alt=""></span>
<li :class="{my:true, active:myStyle}" @click="goPage('/ucenter')">
<span><img src="../assets/images/home/main/my.png" alt=""></span>
<p>我的</p>
</li>
</ul>
@ -23,52 +23,50 @@
<script>
export default {
name: "home",
name: "tabbar",
props: ['current'],
data() {
return {
homeStyle: true,
expertStyle: false,
evaluationStyle: false,
myStyle: false,
isLogin: false
isLogin: false,
}
},
created() {
this.changeStyleNav(this.current);
},
beforeRouteUpdate(to, from, next) {
// console.log(to);
document.title = to.meta.title;
this.changeStyleNav(to.name);
this.changeStyleNav(this.current);
next();
},
activated() {
document.title = this.$route.meta.title;
this.changeStyleNav(this.$route.name);
this.changeStyleNav(this.current);
},
methods: {
//
changeStyleNav(name) {
switch (name) {
case "index":
changeStyleNav(number) {
switch (number) {
case 1:
this.homeStyle = true;
this.expertStyle = false;
this.evaluationStyle = false;
this.myStyle = false;
break;
case "expert":
case 2:
this.homeStyle = false;
this.expertStyle = true;
this.evaluationStyle = false;
this.myStyle = false;
break;
case "evaluation":
case 3:
this.homeStyle = false;
this.expertStyle = false;
this.evaluationStyle = true;
this.myStyle = false;
break;
case "my":
case 4:
this.homeStyle = false;
this.expertStyle = false;
this.evaluationStyle = false;

View File

@ -2,7 +2,7 @@ import Vue from 'vue'
import VueRouter from 'vue-router'
import login from '../views/login.vue' //登录
import index from '../views/index/index.vue' //登录
import index from '../views/index/index.vue' //首页
import verification from '../views/login/verification.vue' //手机验证
import start from '../views/home/start/index.vue' //开屏
@ -30,7 +30,8 @@ import editdetail from '../views/consultant/detail.vue' //预览详情
Vue.use(VueRouter)
const routes = [{
const routes = [
{
path: '/',
name: 'login',
component: login

View File

@ -91,12 +91,17 @@
</ul>
<div class="tips-btn" @click="noTips()"></div>
</div>
<tabbar :current="3"></tabbar>
</div>
</template>
<script>
import tabbar from '../../../components/tabbar.vue'
export default {
name: "evaluation",
components: {
tabbar
},
data(){
return {
isScrollTop: false,

View File

@ -75,12 +75,17 @@
<span @click="closeEV()"></span>
</div>
</div>
<tabbar :current="2"></tabbar>
</div>
</template>
<script>
import tabbar from '../../../components/tabbar.vue'
export default {
name: "expert",
components: {
tabbar
},
data(){
return {
isScrollTop: false,

View File

@ -17,11 +17,7 @@
</div>
</div>
<!-- 领取咨询卡 -->
<div
class="index-receive"
@click="goPage('/information')"
v-if="consult_amount == 0"
>
<div class="index-receive" @click="goPage('/information')" v-if="consult_amount == 0">
<img src="../../assets/images/home/index/receive.jpg" alt="" />
<span>完善信息立即领取免费咨询卡(1小时)</span>
</div>
@ -34,7 +30,7 @@
<ul class="index-expert-list">
<li v-for="(item, index) in expertData" :key="index">
<div class="expert-img">
<img :src="item.avatar" alt="" />
<img :src="host + item.avatar" alt="" />
</div>
<div class="expert-name">
{{ item.name }}<span>{{ item.keywords_list[1] }}</span>
@ -62,16 +58,9 @@
<span @click="goPage('/evaluation')"></span>
</div>
<ul class="index-evaluation-list">
<li
@click="cpUrl()"
v-for="(item, index) in evaluationData"
:key="index"
>
<li @click="cpUrl()" v-for="(item, index) in evaluationData" :key="index">
<div class="evaluation-img">
<img
src="../../assets/images/home/index/evaluation-01.png"
alt=""
/>
<img src="../../assets/images/home/index/evaluation-01.png" alt="" />
</div>
<p>{{ item.title }}</p>
<div class="evaluation-btn" @click="goPage()"></div>
@ -102,48 +91,49 @@
</li>
</ul>
</div>
<tabbar :current="1"></tabbar>
</div>
</template>
<script>
import tabbar from '../../components/tabbar.vue'
export default {
name: "index",
components: {
tabbar
},
data() {
return {
isScrollTop: false,
isReceive: 0, //
bannerSrc: "",
expertData: [
{
name: "赵晓",
expertData: [],
planData: [{
imgSrc: "",
year: "从业5年",
honor: [{ title: "硕士" }, { title: "中科院" }],
title: "强基计划"
},
{
name: "赵晓",
imgSrc: "",
year: "从业3年",
honor: [{ title: "硕士" }, { title: "中科院" }],
title: "综合评价"
},
{
name: "赵晓",
imgSrc: "",
year: "从业8年",
honor: [{ title: "硕士" }, { title: "中科院" }],
title: "专项计划"
},
],
planData: [
{ imgSrc: "", title: "强基计划" },
{ imgSrc: "", title: "综合评价" },
{ imgSrc: "", title: "专项计划" },
evaluationData: [{
imgSrc: "",
title: "霍兰德职业兴趣测评"
},
{
imgSrc: "",
title: "MBIT职业性格测试"
},
],
evaluationData: [
{ imgSrc: "", title: "霍兰德职业兴趣测评" },
{ imgSrc: "", title: "MBIT职业性格测试" },
],
headlinesData: [
{ title: "全国各省市最好大学+王牌专业盘点", time: "2022年2月12日" },
headlinesData: [{
title: "全国各省市最好大学+王牌专业盘点",
time: "2022年2月12日"
},
{
title: "批次、批次线、大类招生到底是什么20个名词帮 你快速了解",
time: "2022年2月12日",
@ -157,8 +147,7 @@ export default {
time: "2022年2月12日",
},
{
title:
"比普通批低100多分从高一准备到高三报考2022 年强基计划最新报考指南",
title: "比普通批低100多分从高一准备到高三报考2022 年强基计划最新报考指南",
time: "2022年2月12日",
},
],

View File

@ -25,31 +25,23 @@
<div class="line" v-if="isReceive == 1"></div>
<ul class="student-information">
<li @click="goPage('/bind')">
<span
><img src="../../../assets/images/user/icon-phone.png" alt=""
/></span>
<span><img src="../../../assets/images/user/icon-phone.png" alt="" /></span>
<p>手机号<em>18683958573</em></p>
<img src="../../../assets/images/home/expert/arrow-right.png" alt="" />
</li>
<li @click="goPage('/info')">
<span
><img src="../../../assets/images/user/icon-student.png" alt=""
/></span>
<span><img src="../../../assets/images/user/icon-student.png" alt="" /></span>
<p>考生信息</p>
<img src="../../../assets/images/home/expert/arrow-right.png" alt="" />
</li>
</ul>
<div class="feedback" @click="goPage('/feedback')">
<span
><img src="../../../assets/images/user/icon-feedback.png" alt=""
/></span>
<span><img src="../../../assets/images/user/icon-feedback.png" alt="" /></span>
<p>意见和反馈</p>
<img src="../../../assets/images/home/expert/arrow-right.png" alt="" />
</div>
<div :class="{ 'my-report': true, open: isOpen }" @click="isOpen = !isOpen">
<span
><img src="../../../assets/images/user/icon-report.png" alt=""
/></span>
<span><img src="../../../assets/images/user/icon-report.png" alt="" /></span>
<p>我的报告</p>
<img src="../../../assets/images/home/expert/arrow-right.png" alt="" />
</div>
@ -88,12 +80,17 @@
</li>
</ul>
<div class="feedback-btn">退出登录</div>
<tabbar :current="4"></tabbar>
</div>
</template>
<script>
import tabbar from '../../../components/tabbar.vue'
export default {
name: "expert",
components: {
tabbar
},
data() {
return {
isScrollTop: false,