diff --git a/rc-busness/pages/index.vue b/rc-busness/pages/index.vue index e2ec3179..686d037a 100644 --- a/rc-busness/pages/index.vue +++ b/rc-busness/pages/index.vue @@ -1,10 +1,7 @@ @@ -720,9 +715,11 @@ meta: {title: '首页'}, data(){ return{ + fixedHeader:false, + dataLoaded:true, useraindex:0, usertitle:'明星猫粮', - dogtitle:'明星狗粮', + dogtitle:'明星犬粮', processinformation:[], catshi:[], userindex:0, @@ -800,10 +797,16 @@ ], 'pc':[ {src:"/images/banner/pc-banner1.png",link:""}, - {src:"/images/banner/pc-banner2.png",link:""} + {src:"/images/banner/pc-banner2.png",link:""}, + {src:"/images/banner/pc-banner3.png",link:""}, + {src:"/images/banner/pc-banner4.png",link:""} ] }, showingBanners:[], + maoganCurIndex:0, + maoshiCurIndex:0, + quanshiCurIndex:0, + quanganCurIndex:0, userdoglist: [ { title: "小型犬", @@ -840,10 +843,10 @@ discountlist: [ { - title: "明星猫粮", - detail:'为10月龄及以上英国短毛猫成猫量身打造的精准营养', - catimage: require("../assets/star-cat.png"), - price:'¥2' + title: "明星猫粮", + detail:'为10月龄及以上英国短毛猫成猫量身打造的精准营养', + catimage: require("../assets/star-cat.png"), + price:'¥2' }, { title: "猫湿粮", @@ -859,7 +862,7 @@ catimage: require("../assets/cat.png"), }, { - title: "明星狗粮", + title: "明星犬粮", detail:'为10月龄及以上英国短毛猫成猫量身打造的精准营养', price:'¥112', catimage: require("../assets/six.png"), @@ -917,64 +920,72 @@ ], catlistvideo: [ { - title: "明星猫粮", + title: "主食级猫湿粮", video:"/images/cat/one.mp4", catimage: "/images/cat/one.jpg", - detail:'为10月龄及以上英国短毛猫成猫量身打造的精准营养', - price:'¥123.45', + productimage: "/images/cat/star-1.png", + detail:'为10柔软细腻慕斯 适合离乳期幼猫舔食', + price:'¥77', }, { - title: "猫湿粮", - video:"/images/cat/two.mp4", - catimage: "/images/cat/two.jpg", - detail:'为10月龄及以上英国短毛猫成猫量身打造的精准营养', - price:'¥123.45', + title: "幼猫成长专属", + video:"/images/cat/two.mp4", + catimage: "/images/cat/two.jpg", + productimage: "/images/cat/star-2.png", + detail:'支持幼猫自身保护力 为快速生长提供足够能量', + price:'¥147', }, { - title: "猫干粮", + title: "室内成猫专属", video:"/images/cat/three.mp4", catimage: "/images/cat/three.jpg", - detail:'为10月龄及以上英国短毛猫成猫量身打造的精准营养', - price:'¥123.45', + productimage: "/images/cat/star-3.png", + detail:'高易消化蛋白 减少粪便量和异味', + price:'¥140', }, { - title: "猫干粮", + title: "英短成猫专属", video:"/images/cat/four.mp4", catimage: "/images/cat/four.jpg", - detail:'为10月龄及以上英国短毛猫成猫量身打造的精准营养', - price:'¥123.45', + productimage: "/images/cat/star-4.png", + detail:'增强肌肉质量 支持骨骼与关节健康', + price:'¥183', }, ], doglistvideo: [ { - title: "明星狗粮", - video:"/images/dog/one.mp4", - catimage: "/images/dog/one.jpg", - detail:'为10月龄及以上成犬量身打造的精准营养', - price:'¥123.45', + title: "主食级狗湿粮", + video:"/images/dog/one.mp4", + catimage: "/images/dog/one.jpg", + productimage: "/images/cat/star-1.png", + detail:'柔软细腻慕斯 适合离乳期幼犬舔食', + price:'¥77', }, { - title: "狗湿粮", - video:"/images/dog/two.mp4", - catimage: "/images/dog/two.jpg", - detail:'为10月龄及以上英国成犬量身打造的精准营养', - price:'¥123.45', + title: "贵宾成犬专属", + video:"/images/dog/two.mp4", + catimage: "/images/dog/two.jpg", + productimage: "/images/cat/star-2.png", + detail:'护肤靓毛 理想体态', + price:'¥241', }, { - title: "狗干粮", - video:"/images/dog/three.mp4", - catimage: "/images/dog/three.jpg", - detail:'为10月龄及以上英国犬成犬量身打造的精准营养', - price:'¥123.45', + title: "小型犬成犬专属", + video:"/images/dog/three.mp4", + catimage: "/images/dog/three.jpg", + productimage: "/images/cat/star-3.png", + detail:'亮泽被毛 呵护牙齿', + price:'¥121', }, - { - title: "狗干粮", - video:"/images/dog/four.mp4", - catimage: "/images/dog/four.jpg", - detail:'为10月龄及以上英国成犬量身打造的精准营养', - price:'¥123.45', + { + title: "离乳期全价奶糕", + video:"/images/dog/four.mp4", + catimage: "/images/dog/four.jpg", + productimage: "/images/cat/star-4.png", + detail:'高易再水合颗粒 帮助增强保护健康成长', + price:'¥88', }, ], @@ -1139,8 +1150,14 @@ } window.addEventListener("scroll", this.handleScroll, true); this.userchufang();//查询处方粮商品信息 + this.catmessage();//查询猫的信息 + this.catclickGan(); + this.catclickShi(); + this.dogmessage();//查询狗的信息 + this.userdogShi(); + this.userdogGan(); }, destroyed () { window.removeEventListener('scroll', this.scrollToTop); @@ -1192,8 +1209,6 @@ ifadroind(item,index,order){ //console.log(item,index,order); - - var sUserAgent = navigator.userAgent.toLowerCase(); var bIsIpad = sUserAgent.match(/ipad/i) == "ipad"; var bIsIphoneOs = sUserAgent.match(/iphone os/i) == "iphone os"; @@ -1204,8 +1219,8 @@ var bIsCE = sUserAgent.match(/windows ce/i) == "windows ce"; var bIsWM = sUserAgent.match(/windows mobile/i) == "windows mobile"; - if (!(bIsIpad || bIsIphoneOs || bIsMidp || bIsUc7 || bIsUc || bIsAndroid || bIsCE || bIsWM)) { - //console.log("当前是电脑打开啊啊啊") + if (!(bIsIpad || bIsIphoneOs || bIsMidp || bIsUc7 || bIsUc || bIsAndroid || bIsCE || bIsWM)) { + //console.log("当前是电脑打开啊啊啊") if(item.title=='明星猫粮'){ this.catproduct=true; this.twomao=false; @@ -1268,7 +1283,7 @@ this.dogshow=false; this.catproduct=false; } - if(item.title=='明星狗粮'){ + if(item.title=='明星犬粮'){ this.onemao=false; this.twomao=false; this.threemao=false; @@ -1290,19 +1305,43 @@ let dogtop=document.querySelector('.oc-top'); //console.log(dogtop); //console.log(mingxin.offsetTop); + + let positionIdentifier=document.querySelectorAll('.ts-position-identifier'); + let tmpTitle=''; + let scrollToTop=0; + let _self=this; + let transition = 230; + positionIdentifier.forEach(function(ele,index){ + tmpTitle = ele.getAttribute("data-rel"); + if(item.title==tmpTitle) + { + if(_self.fixedHeader && item.title!='明星猫粮') + { + transition+=130; + } + scrollToTop = _self.heightToTop(positionIdentifier[index]) - transition; + //positionIdentifier[index].scrollIntoView(true); + window.scrollTo({ + top:scrollToTop, + behavior:'smooth' + }) + //document.body.scrollTop = oPos; + } + }) + /* if(item.title=='犬湿粮'||item.title=='犬干粮'||item.title=='处方用粮'){ - userindex=userindex-2 + userindex=userindex-2 }else{ - userindex=userindex-1 + userindex=userindex-1 } if(item.title=='明星猫粮'){ - mingxin.scrollIntoView(true); + mingxin.scrollIntoView(true); }else{ - let catshiid=document.querySelectorAll('.selectionswitch'); - catshiid[userindex].scrollIntoView(true); + let catshiid=document.querySelectorAll('.selectionswitch'); + catshiid[userindex].scrollIntoView(true); } - if(item.title=='明星狗粮') - dogtop.scrollIntoView(true); + if(item.title=='明星犬粮') + dogtop.scrollIntoView(true); // if(item.title=="猫湿粮"){ // this.catproduct=false; // this.catfood=true; @@ -1312,6 +1351,7 @@ // } //console.log("当前是手机打开") + */ } }, heightToTop(ele){ @@ -1358,70 +1398,70 @@ this.userserachlist.push(petType) } } - this.dogmessage(this.userserachlist) - }, - - - userlook(order){ - if(order==0){ - this.catshi=this.catlist; - } - if(order==1){ - this.catgan=this.catlist; - - }else if(order==2){ - this.dogshi=this.doglist - } - else if(order==3){ - this.doggan=this.doglist - } - else if(order==4){ - this.processinformation=this.chufanlist - } - - }, - - - showmesg(){ - this.toTop(); - }, - handleScroll(e) - { - let fixedCatbarSeperator = document.getElementById("fixed-catbar-seperator"); - if(!fixedCatbarSeperator) + //TODO how to combine "apiName" here? + this.dogmessage(this.userserachlist,"Gan"); + }, + userlook(order){ + if(order==0){ + this.catshi=this.catlist; + } + if(order==1){ + this.catgan=this.catlist; + }else if(order==2){ + this.dogshi=this.doglist + } + else if(order==3){ + this.doggan=this.doglist + } + else if(order==4){ + this.processinformation=this.chufanlist + } + }, + showmesg(){ + this.toTop(); + }, + handleScroll(e) { - return; - } - let scrolltop = document.documentElement.scrollTop || document.body.scrollTop; - if((scrolltop-fixedCatbarSeperator.offsetTop)>0) - { - this.gotop = true - this.searchBar=false - } - else - { - this.gotop = false; - this.searchBar=true - } - }, - 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); - }, - async courseId(item) { - let data = await postCourseId(this.productCode,1,this.usermessage.data.id,this.usermessage.data.mobile,item.picFile,item.name,item.basePrice,item.specifications); - if(data){ - this.productlist=data; - } - }, - //请求猫 - async catmessage(stype) { + let fixedCatbarSeperator = document.getElementById("fixed-catbar-seperator"); + if(!fixedCatbarSeperator) + { + return; + } + let scrolltop = document.documentElement.scrollTop || document.body.scrollTop; + if((scrolltop-fixedCatbarSeperator.offsetTop)>0) + { + this.fixedHeader=false; + this.gotop = true + this.searchBar=false + } + else + { + this.fixedHeader=true; + this.gotop = false; + this.searchBar=true + } + }, + 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); + }, + async courseId(item) { + this.dataLoaded=false; + let data = await postCourseId(this.productCode,1,this.usermessage.data.id,this.usermessage.data.mobile,item.picFile,item.name,item.basePrice,item.specifications); + if(data){ + this.productlist=data; + this.dataLoaded=true; + } + }, + //请求猫 + async catmessage(stype,dataType) { + this.dataLoaded=false; let data=[]; if(stype==undefined||stype==null){ data = await biaomessage(0,'',1,6); @@ -1429,11 +1469,22 @@ data = await biaomessage(this.userserachlist,'',1,6); } if(data){ - this.catlist=data; let userlist=[]; - userlist=data.slice(0,6); - this.catshi=userlist; - this.catgan=userlist; + //userlist=data.slice(0,6); + if(dataType) + { + if(dataType=='Shi') + this.catshi=data; + else if(dataType=='Gan') + this.catgan=data; + } + else + { + this.catlist=data; + //this.catgan=userlist; + //this.catshi=userlist; + } + this.dataLoaded=true; } }, @@ -1466,7 +1517,7 @@ } }, - selectproduce(item,index){ + selectproduce(item,index){ if(item.productList[0]==undefined){ item.productlist[0].productCode=0; } @@ -1480,29 +1531,29 @@ productCode:item.productList[0].productCode }, }); - }, + }, - //请求处方量信息数据 - async userchufang() { - let list=[]; - let data = await userque(); - if(data){ - list=data.slice(0,6); - this.processinformation=list; - this.chufanlist=data; - - } - - }, - - //点击请求处方量标签信息数据 - async userquery(item) { - let data = await userquery(item); - if(data){ - this.processinformation=data; - } - - }, + //请求处方量信息数据 + async userchufang() { + this.dataLoaded=false; + let list=[]; + let data = await userque(); + if(data){ + list=data.slice(0,6); + this.processinformation=list; + this.chufanlist=data; + this.dataLoaded=true; + } + }, + //点击请求处方量标签信息数据 + async userquery(item) { + this.dataLoaded=false; + let data = await userquery(item); + if(data){ + this.processinformation=data; + this.dataLoaded=true; + } + }, //处方用粮筛选 userclick(item,index){ this.userquery(index) @@ -1537,68 +1588,61 @@ this.userserachlist.push(petType) } } - this.catmessage(this.userserachlist) + this.catmessage(this.userserachlist,'Shi') }, - lianxi(item,index){ - if(item.title=='在线客服'){ - var option = { - customer: {id: '', name: '', email: '', mobile: '', memberId: '999999'} - } - dis_livchat(option); - } - if(item.title=='购物车'){ - this.$router.push({ - path: "/myorder/userrecord", + lianxi(item,index){ + if(item.title=='在线客服'){ + var option = { + customer: {id: '', name: '', email: '', mobile: '', memberId: '999999'} + } + dis_livchat(option); + } + if(item.title=='购物车'){ + this.$router.push({ + path: "/myorder/userrecord", + }); + } + if(item.title=='营养专家'){ + var option = { + customer: {id: '', name: '', email: '', mobile: '', memberId: '999999'} + } + dis_livchat(option); + } + + }, + userbuy(item){ + let user= localStorage.getItem("userInfo"); + this.courseId(item) + this.$router.push({ + path: "/myorder/userrecord", + }); + }, - }); - } - if(item.title=='营养专家'){ - var option = { - customer: {id: '', name: '', email: '', mobile: '', memberId: '999999'} - } - dis_livchat(option); - } - - }, - userbuy(item){ - let user= localStorage.getItem("userInfo"); - this.courseId(item) - this.$router.push({ - path: "/myorder/userrecord", - - }); - }, - -selectGoods(item,index){ - console.log(item,index); - this.activeIndex=index; - console.log(item.title); - - this.ifadroind(item,index,this.useraindex) -// this.ifAdoid(item,index); - -}, -quanshi(item,index){ - console.log(item,index); - this.activeIndex5=index - console.log(this.activeIndex5); - -}, -userdoghot(item,index){ - this.activeIndex6=index - -}, -selectGo(item,index){ -this.activeInde2=index; -}, -selectGoo(item,index){ - -this.activeInde3=index; -} - }, + selectGoods(item,index){ + //console.log(item,index); + this.activeIndex=index; + //console.log(item.title); + this.ifadroind(item,index,this.useraindex) + // this.ifAdoid(item,index); + }, + quanshi(item,index){ + this.activeIndex5=index; + this.userdogShi(); + }, + userdoghot(item,index){ + this.activeIndex6=index; + this.userdogGan(); + }, + selectGo(item,index){ + this.activeInde2=index; + }, + selectGoo(item,index){ + this.activeInde3=index; + } + }, }