prod
parent
5d491988ec
commit
9ddfa2f32f
@ -0,0 +1,255 @@
|
||||
|
||||
<template>
|
||||
<div class="iH-outter">
|
||||
<div class="iH-left">
|
||||
<a-dropdown placement="bottomLeft">
|
||||
<img class="iH-left-img1" src="../../assets/images/Index/ic_cd.png" />
|
||||
<a-menu slot="overlay" @click="handlerType">
|
||||
<a-menu-item key="index">
|
||||
<span>行业洞察</span>
|
||||
</a-menu-item>
|
||||
<a-menu-item key="brandInsight" v-menu="'/brandInsight'">
|
||||
<span>品牌洞察</span>
|
||||
</a-menu-item>
|
||||
<a-menu-item key="modelInsight" v-menu="'/modelInsight'">
|
||||
<span>车型洞察</span>
|
||||
</a-menu-item>
|
||||
<a-menu-item key="eventInsight" v-menu="'/eventInsight'">
|
||||
<span>事件洞察</span>
|
||||
</a-menu-item>
|
||||
<a-menu-item key="marketingAnalysis" v-menu="'/marketingAnalysis'">
|
||||
<span>营销分析</span>
|
||||
</a-menu-item>
|
||||
</a-menu>
|
||||
</a-dropdown>
|
||||
<span class="iH-left-s1">菜单</span>
|
||||
|
||||
</div>
|
||||
<div class="iH-center">
|
||||
<a @click="goHome">
|
||||
<img src="../../assets/images/Index/img_toubuyi.png" width="100%" />
|
||||
</a>
|
||||
</div>
|
||||
<div class="iH-right">
|
||||
<span class="s1">{{ clock }}</span>
|
||||
<span class="s2">{{ sClock }}</span>
|
||||
<span class="s2">{{ week }}</span>
|
||||
<img class="m1" src="../../assets/images/Index/ic_ry.png"/>
|
||||
<span class="s3">{{getUser.UserName}}</span>
|
||||
<a-dropdown placement="bottomRight" v-if="this.getToken">
|
||||
<a class="ant-dropdown-link">
|
||||
<a-icon type="down" />
|
||||
</a>
|
||||
<a-menu slot="overlay">
|
||||
<a-menu-item @click="handlerMyself">
|
||||
<span>个人中心</span>
|
||||
</a-menu-item>
|
||||
<a-menu-item @click="layout">
|
||||
<span>退出</span>
|
||||
</a-menu-item>
|
||||
</a-menu>
|
||||
</a-dropdown>
|
||||
<a @click="goLogin" class="s4" v-if="!this.getToken">登录</a>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {getCheZhuTime0528} from "@/api/home"
|
||||
export default {
|
||||
name: "iHeaderMyself",
|
||||
inject: ['reload'],
|
||||
data() {
|
||||
return {
|
||||
selVal: '',
|
||||
clock: "",
|
||||
sClock: "",
|
||||
week: "",
|
||||
intDt: null,
|
||||
timeShow: true,
|
||||
form: {
|
||||
sTimeType: 4,
|
||||
sStartTime: "",
|
||||
sEndTime: ""
|
||||
},
|
||||
selDatas: [
|
||||
|
||||
],
|
||||
};
|
||||
},
|
||||
// watch: {
|
||||
// $route: {
|
||||
// handler(val) {
|
||||
// if (val.path === "/mcIndex") {
|
||||
// this.timeShow = false;
|
||||
// } else {
|
||||
// this.timeShow = true;
|
||||
// }
|
||||
// },
|
||||
// immediate: true,
|
||||
// },
|
||||
// },
|
||||
created() {
|
||||
this.getSelect()
|
||||
},
|
||||
mounted() {
|
||||
this.intDt = self.setInterval(() => {
|
||||
let obj = this.getDatetime();
|
||||
this.clock = obj.clock;
|
||||
this.sClock = obj.sClock;
|
||||
this.week = obj.week;
|
||||
}, 1000);
|
||||
},
|
||||
destroyed() {
|
||||
if (this.intDt) {
|
||||
self.clearInterval(this.intDt);
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
goHome() {
|
||||
this.setHeaderType(1);
|
||||
this.$router.push("/index");
|
||||
},
|
||||
// 获取选择时间的数据
|
||||
getSelect() {
|
||||
getCheZhuTime0528().then(res => {
|
||||
this.selDatas = res.data
|
||||
this.selVal = this.selDatas[0].key;
|
||||
this.form.sStartTime = this.selDatas[0].starttime;
|
||||
this.form.sEndTime = this.selDatas[0].endtime;
|
||||
this.setCtime(this.form);
|
||||
})
|
||||
},
|
||||
// 选择时间
|
||||
handlerSelect(key) {
|
||||
let n = this.selDatas.findIndex(ele => {
|
||||
return ele.key === key
|
||||
})
|
||||
let obj = this.selDatas[n];
|
||||
this.form.sStartTime = obj.starttime;
|
||||
this.form.sEndTime = obj.endtime;
|
||||
this.setCtime(this.form);
|
||||
this.setChangeSTime(1);
|
||||
this.reload();
|
||||
},
|
||||
// 点击个人中心
|
||||
handlerMyself() {
|
||||
this.setHeaderType(4);
|
||||
this.$router.push("/myself");
|
||||
},
|
||||
// 菜单
|
||||
handlerType(obj) {
|
||||
if (obj.key === "marketingAnalysis") {
|
||||
this.setHeaderType(2);
|
||||
} else if(obj.key === 'brandInsight' || obj.key === 'modelInsight' || obj.key === "eventInsight") {
|
||||
this.setHeaderType(3);
|
||||
} else {
|
||||
this.setHeaderType(1);
|
||||
}
|
||||
this.$router.push({path: `/${obj.key}`})
|
||||
},
|
||||
// 退出的方法
|
||||
layout() {
|
||||
this.setToken("");
|
||||
this.setUser({});
|
||||
this.setEComparison([]);
|
||||
this.setBComparison([]);
|
||||
this.setMComparison([]);
|
||||
this.setCtime({});
|
||||
this.setCtime2({});
|
||||
this.setCommTime({});
|
||||
this.setBrand({});
|
||||
this.setModel({});
|
||||
this.$router.replace("/login");
|
||||
}
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="less" scoped>
|
||||
.iH-outter {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
width: 100%;
|
||||
height: 80px;
|
||||
background-image: url("../../assets/images/Index/img_toubuer.png");
|
||||
background-repeat: no-repeat;
|
||||
background-size: 100% 100%;
|
||||
.iH-left {
|
||||
display: flex;
|
||||
width: 657px;
|
||||
margin-left: 16px;
|
||||
justify-content: flex-start;
|
||||
margin-top: 16px;
|
||||
height: 32px;
|
||||
.iH-left-img1 {
|
||||
width: 24px;
|
||||
height: 24px;
|
||||
cursor: pointer;
|
||||
}
|
||||
.iH-left-s1 {
|
||||
display: block;
|
||||
font-size: 14px;
|
||||
font-weight: bold;
|
||||
color: #ffffff;
|
||||
margin-left: 8px;
|
||||
margin-top: 2px;
|
||||
}
|
||||
}
|
||||
.iH-center {
|
||||
width: 490px;
|
||||
height: auto;
|
||||
}
|
||||
.iH-right {
|
||||
display: flex;
|
||||
height: 32px;
|
||||
width: 657px;
|
||||
justify-content: flex-end;
|
||||
margin-right: 16px;
|
||||
margin-top: 16px;
|
||||
.s1 {
|
||||
display: inline-block;
|
||||
font-size: 16px;
|
||||
color: #ffffff;
|
||||
}
|
||||
.s2 {
|
||||
display: inline-block;
|
||||
font-size: 16px;
|
||||
color: #ffffff;
|
||||
margin-left: 24px;
|
||||
}
|
||||
.s3 {
|
||||
display: inline-block;
|
||||
font-size: 14px;
|
||||
color: #ffffff;
|
||||
margin-left: 8px;
|
||||
}
|
||||
.s4 {
|
||||
display: inline-block;
|
||||
font-size: 16px;
|
||||
color: #ffffff;
|
||||
margin-right: 8px;
|
||||
}
|
||||
.m1 {
|
||||
display: inline-block;
|
||||
margin-left: 60px;
|
||||
margin-right: 8px;
|
||||
width: 24px;
|
||||
height: 24px;
|
||||
}
|
||||
}
|
||||
}
|
||||
.ant-dropdown-link {
|
||||
color: #63aecc;
|
||||
margin-left: 11px;
|
||||
/deep/ .anticon svg {
|
||||
font-size: 20px !important;
|
||||
margin-top: 0px;
|
||||
}
|
||||
}
|
||||
.selHead {
|
||||
width: 120px;
|
||||
margin-left: 40px;
|
||||
margin-right: 8px;
|
||||
}
|
||||
</style>
|
||||
Loading…
Reference in new issue