smart-admin/rc-busness/components/fixed-right.vue
2022-01-23 16:50:49 +08:00

112 lines
2.3 KiB
Vue

<template>
<div class="rc-fixright" >
<ul >
<li v-for="(userfixed,index) in fixedlist" :key="index" @click="lianxi(userfixed,index)">
<img :src="userfixed.catimage" alt="">
<span> {{userfixed.title}}</span>
</li>
</ul>
<div class="tuntop" @click="toTop" v-show="gotop">
<img src="../assets/image/turntop.png" alt="">
<span>回到顶部</span>
</div>
</div>
</template>
<script>
import { mapMutations } from "vuex";
export default {
data(){
return{
gotop: false,
loginornot:false,
fixedlist: [
{
title: "购物车",
catimage: require("../assets/buy.png"),
},
{
title: "在线客服",
catimage: require("../assets/service.png"),
},
{
title: "营养专家",
catimage: require("../assets/consult.png"),
}
]
}
},
methods:{
...mapMutations(["checkIsLogin"]),
lianxi(item,index){
if(item.title=='在线客服'){
var option = {
customer: {id: '', name: '', email: '', mobile: '', memberId: '999999'}
}
dis_livchat(option);
}
if(item.title=='购物车'){
if(this.loginornot){
this.$router.push({
path: "/userlogin/login",
});
} else {
this.$router.push({
path: "/myorder/userrecord",
});
}
}
if(item.title=='营养专家'){
var option = {
customer: {id: '', name: '', email: '', mobile: '', memberId: '999999'}
}
dis_livchat(option);
}
},
toTop() {
let top = document.documentElement.scrollTop || document.body.scrollTop;
// 实现滚动效果
const timeTop = setInterval(() => {
document.body.scrollTop = document.documentElement.scrollTop = top -= 400;
if (top <= 0) {
clearInterval(timeTop);
}
}, 10);
},
handleScroll() {
let scrolltop = document.documentElement.scrollTop || document.body.scrollTop;
if(scrolltop>400)
{
this.gotop = true
}
else
{
this.gotop = false
}
}
},
created(){
},
mounted(){
//Check login
this.checkIsLogin();
let usernot = this.$store.state.userInfo;
//console.log(usernot);
if(usernot==null ||usernot==undefined){
this.loginornot=true
}else{
this.loginornot=false
this.usermessage=usernot;
}
//Check login end
window.addEventListener("scroll", this.handleScroll, true);
}
}
</script>
<style lang="less" scoped >
</style>