Merge branch 'sit-jiamin-v2' of https://gitee.com/carl_Ming_1/smart-admin into sit-jiamin-v2

This commit is contained in:
952108534@qq.com 2022-01-20 14:40:59 +08:00
commit 4ff39ff36a
13 changed files with 813 additions and 785 deletions

View File

@ -9,16 +9,10 @@ body{
opacity: 0; opacity: 0;
} }
.userloding { .userloding {
position: fixed;
left: 50%;
margin-left: -1.56rem;
top: 50%;
margin-top: -3.75rem;
background: url(../image/onloading.png) center center no-repeat; background: url(../image/onloading.png) center center no-repeat;
width: 3.12rem; width: 3.12rem;
background-size: contain; background-size: contain;
height: 7.5rem; height: 3.12rem;
z-index: 1000;
animation: rolling 4s infinite; animation: rolling 4s infinite;
-webkit-animation:rolling 4s infinite; -webkit-animation:rolling 4s infinite;
} }
@ -229,13 +223,12 @@ img, picture {
right: 0; right: 0;
top: 30%; top: 30%;
background: #FFFFFF; background: #FFFFFF;
box-shadow: 0px 0px .62rem rgba(0, 0, 0, 0.16); box-shadow: 0 0 10px rgba(0, 0, 0, 0.16);
border-radius: .25rem; border-radius: .25rem;
z-index:3; z-index:3;
ul{ ul{
width: 60px; width: 60px;
height: 181px; height: 181px;
box-shadow: 0px 0px 6px rgb(0 0 0 / 10%);
background-color: white; background-color: white;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
@ -323,9 +316,7 @@ img, picture {
margin-top: 90px; margin-top: 90px;
} }
.rc-list__header { .rc-list__header {
background: none;
padding: .5rem 0;
border-bottom: none;
} }
.ts-right-arr { .ts-right-arr {
border-bottom:1px solid #E1001A; border-bottom:1px solid #E1001A;
@ -416,8 +407,13 @@ img, picture {
display:block; display:block;
li{ li{
max-width:20rem; max-width:20rem;
min-width:18.75rem;
width:22.8vw;
//margin-right:.875rem; //margin-right:.875rem;
margin-left:2.2vw; margin-left:2vw;
padding-left:1px;
padding-right:1px;
box-sizing: border-box;
.rc-column{ .rc-column{
span{ span{
font-size:1.875rem; font-size:1.875rem;
@ -432,7 +428,7 @@ img, picture {
} }
} }
img{ img{
width:21.7vw; width:100%;
max-width:320px; max-width:320px;
min-width:160px; min-width:160px;
} }
@ -539,35 +535,40 @@ img, picture {
} }
h2{ h2{
font-size:20px; font-size:20px;
padding-bottom:1rem;
} }
.ts-scrollable .ts-scrollable
{ {
padding-bottom:1rem;
scrollbar-width: thin;
li li
{ {
margin-left: 30px; margin-left: 30px;
width: 8.125rem; width: 8.125rem;
height: 2.5rem; height: 2.5rem;
line-height: 40px; //line-height: 40px;
font-size: .875rem; font-size: .875rem;
padding:.375rem;
} }
/*
&::-webkit-scrollbar{ &::-webkit-scrollbar{
background:unset; height: 6px;
height:4px; width:50%;
background:transparent;
} }
&::-webkit-scrollbar-thumb{ &::-webkit-scrollbar-thumb{
background-color:#d7d7d7; background-color:#d7d7d7;
height:2px; border-radius:10px;
width:50%;
} }
&::-webkit-scrollbar-track{ &::-webkit-scrollbar-track{
background-color:ddd; //background-color:#ddd;
background-color:transparent;
height:2px;
} }
&::-webkit-scrollbar-button{ &::-webkit-scrollbar-button{
background:unset; background:unset;
} }
*/ /* */
} }
} }
@ -589,10 +590,10 @@ img, picture {
{ {
.ts-product-list { .ts-product-list {
display:flex; display:flex;
justify-content: space-between; //justify-content: space-between;
li{ li{
margin-left:0; //margin-left:0;
margin-right:0; //margin-right:0;
} }
} }
} }

View File

@ -5,29 +5,44 @@
/deep/.van-swipe__indicator--active{ /deep/.van-swipe__indicator--active{
background-color: #E1001A; background-color: #E1001A;
} }
.rc-ma{
.ul-zhuan{ .ts-carousel-indicator{
li{ /deep/.swiper-pagination-bullet{
background: unset;; margin-left:.5rem;
}
/deep/.swiper-pagination-bullet-active{
background:#E2001A;
}
&.center{
width:100%;
text-align: center;
}
}
.ts-position-identifier{
}
.ul-zhuan,.ul-dog{
li{
background: unset;
img{
border-radius: 50%;
}
&.active {
img{ img{
border-radius: 50%; border: 3px solid #E2001A;
} }
&.active { color: #E2001A;
img{
border: 3px solid #E2001A; }
} &.unactive {
color: #E2001A; color: #444444;
img{
} border: 3px solid #D7D7D7;
&.unactive {
color: #444444;
img{
border: 3px solid #D7D7D7;
}
} }
} }
} }
} }
.uservideo{ .uservideo{
overflow: hidden; overflow: hidden;
video{ video{
@ -35,17 +50,50 @@
width:auto; width:auto;
} }
} }
.ul-dog{
width: 100%;
display: flex;
justify-content: center;
flex-wrap: wrap;
flex-direction: row;
span{
margin-top: .5rem;
display: block;
}
img{
width: 9.5rem;
height: auto;
display: block;
}
li{
cursor: pointer;
font-size: 16px;
text-align: center;
margin-top:3rem;
margin-left:3rem;
}
}
@media screen and (max-width:768px){ @media screen and (max-width:768px){
.ul-dog{ .ul-dog{
display: none; justify-content: space-evenly;
img{
width:4rem;
height:auto;
}
li{
margin-top:1.875rem;
}
} }
.searchBara{ .ts-banner-swiper-container{
position: fixed; margin-bottom:2.5rem;
}
.searchBara{
width: 100%; width: 100%;
position: fixed; position: fixed;
top:66px; top:3.75rem;
background: white; background: white;
z-index: 9999; z-index: 60;
overflow-x: auto; overflow-x: auto;
white-space: nowrap; white-space: nowrap;
overflow-y:hidden; overflow-y:hidden;
@ -62,16 +110,14 @@
display: inline-block; display: inline-block;
margin-left: 0.20rem; margin-left: 0.20rem;
text-align: center; text-align: center;
background: #F6F6F6;
border-radius: 50%; border-radius: 50%;
opacity: 1; opacity: 1;
} }
} }
.rc-login{
.rc-login{ width: 92%;
width: 92%; margin:0 auto;
margin:0 auto; }
}
.userunlogin{ .userunlogin{
width: 100%; width: 100%;
height: 0.60rem; height: 0.60rem;
@ -101,9 +147,6 @@
} }
} }
.van-swipe{
z-index: 2;
}
.rc-usermessage{ .rc-usermessage{
span{ span{
font-size: 1rem; font-size: 1rem;
@ -119,10 +162,12 @@
height: auto; height: auto;
object-fit: cover; object-fit: cover;
} }
.van-swipe{
z-index: 2;
}
.van-swipe-item { .van-swipe-item {
color: #fff; color: #fff;
height: 26.31rem;
width: 100%; width: 100%;
font-size: 0.20px; font-size: 0.20px;
text-align: center; text-align: center;
@ -172,7 +217,6 @@
.uservideo{ .uservideo{
width: 100%; width: 100%;
height:auto; height:auto;
max-height: 15.68rem;
display: block; display: block;
video{ video{
max-width:100%; max-width:100%;
@ -192,7 +236,7 @@
width: 100%; width: 100%;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
justify-content: center; justify-content: flex-start;
align-items: center; align-items: center;
} }
img{ img{
@ -209,6 +253,7 @@
margin-top: 1.25rem; margin-top: 1.25rem;
} }
p{ p{
color: #666666;
font-size: .875rem; font-size: .875rem;
text-overflow: -o-ellipsis-lastline; text-overflow: -o-ellipsis-lastline;
overflow: hidden; overflow: hidden;
@ -219,6 +264,10 @@
-webkit-box-orient: vertical; -webkit-box-orient: vertical;
max-width: 60%; max-width: 60%;
text-align: center; text-align: center;
word-break: keep-all;
height: 2.625rem;
display: flex;
align-items: center;
} }
em{ em{
font-style: normal; font-style: normal;
@ -301,22 +350,22 @@
} }
} }
.active {
font-size: 0.14rem;
img{
border-width: 1px;
}
}
.unactive {
font-size: 0.14rem;
img{
border-width: 1px;
}
}
// .usermain{ // .usermain{
// display: none; // display: none;
// } // }
} }
.active {
font-size: 0.14rem;
img{
border-width: 1px;
}
}
.unactive {
font-size: 0.14rem;
img{
border-width: 1px;
}
}
@media screen and (min-width: 769px) @media screen and (min-width: 769px)
@ -324,14 +373,21 @@
.rc-selection{ .rc-selection{
display: none; display: none;
} }
.sw-center{ .sw-center{
display: none; display: none;
} }
.useraimg{ .useraimg{
width: 100%; width: 100%;
// height: 29.31rem; // height: 29.31rem;
object-fit: cover; object-fit: cover;
} }
.ts-banner-swiper-container{
position:relative;
.ts-carousel-indicator{
position:absolute;
bottom:.4rem;
}
}
.van-swipe-item { .van-swipe-item {
color: #fff; color: #fff;
height: 100%; height: 100%;
@ -350,15 +406,12 @@ object-fit: cover;
#xxxFullScreen { #xxxFullScreen {
background-color: white; background-color: white;
// margin-top: 100px; // margin-top: 100px;
#swiper1 { #swiper1,#swiper2 {
width: 100%;
overflow: hidden; overflow: hidden;
margin-top: 2.31rem; margin-top: 2.31rem;
}
h2{ h2{
padding-bottom: 5rem; padding-bottom: 5rem;
}
} }
.swiper-container2 { .swiper-container2 {
@ -367,10 +420,10 @@ object-fit: cover;
// overflow: visible !important; // overflow: visible !important;
position: relative; position: relative;
} }
#swiper1 .swiper-container .swiper-wrapper .swiper-slide { #swiper1 .swiper-container .swiper-wrapper .swiper-slide {
width: 100%; width: 100%;
//height: 6.18rem; //height: 6.18rem;
} }
/* 上一张 */ /* 上一张 */
#swiper1 .swiper-container .swiper-wrapper .swiper-slide-prev { #swiper1 .swiper-container .swiper-wrapper .swiper-slide-prev {
@ -518,14 +571,18 @@ img{
display: block; display: block;
} }
img{ img{
width: 10vw; width:100%;
height: 10vw; height: auto;
object-fit: contain;
display: block; display: block;
} }
li{ li{
width: 10vw;
max-width:11rem;
cursor: pointer; cursor: pointer;
font-size: 16px; font-size: 16px;
text-align: center; text-align: center;
overflow:hidden;
} }
} }
@ -540,33 +597,7 @@ img{
} }
.usermain{ .usermain{
.ul-dog{
width: 100%;
display: flex;
justify-content: center;
flex-wrap: wrap;
flex-direction: row;
span{
margin-top: 2.5rem;
display: block;
}
img{
width: 9.5rem;
height: 9.5rem;
display: block;
}
li{
cursor: pointer;
font-size: 16px;
width: 9.875rem;
text-align: center;
height: 9.875rem;
background: #F6F6F6;
border-radius: 50%;
margin-left:3rem;
}
}
} }
.rc-main{ .rc-main{
width: 100%; width: 100%;

View File

@ -1,7 +1,9 @@
.container{ .container{
min-height:80vh; min-height:100vh;
height:100%; height:100%;
background-color:#f6f6f6; background-color:#fff;
display: flex;
flex-direction: column;
} }
.ts-max-width--460{ .ts-max-width--460{
border-radius: 3px; border-radius: 3px;
@ -20,6 +22,7 @@
@media screen and (max-width:768px) { @media screen and (max-width:768px) {
.ts-max-width--460{ .ts-max-width--460{
padding:4.375rem 1.25rem; padding:4.375rem 1.25rem;
box-shadow: unset;
} }
.rc-column *{ .rc-column *{
font-size:.875rem; font-size:.875rem;

View File

@ -1,37 +1,37 @@
.rc-margin-bottom--lg{ .rc-margin-bottom--lg{
margin: 0; margin: 0;
} }
@media screen and (max-width:768px){ @media screen and (max-width:768px){
.online{ .online{
width:100%; width:100%;
background:#d7d7d7; background:#d7d7d7;
margin-top:1.5rem; margin-top:1.5rem;
height:.06rem; height:.06rem;
&.bold{ &.bold{
height:8px; height:8px;
background:#f6f6f6; background:#f6f6f6;
} }
} }
.useredit{ .useredit{
display: none; display: none;
} }
.rc-button{ .rc-button{
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
width: 375px; width: 375px;
height: 80px; height: 80px;
background: #FFFFFF; background: #FFFFFF;
box-shadow: 0px -3px 6px rgba(0, 0, 0, 0.1); box-shadow: 0px -3px 6px rgba(0, 0, 0, 0.1);
opacity: 1; opacity: 1;
border-radius: 0px; border-radius: 0px;
} }
.rc-footbutton { .rc-footbutton {
width: 164px; width: 164px;
height: 48px; height: 48px;
border: 2px solid #E2001A; border: 2px solid #E2001A;
opacity: 1; opacity: 1;
@ -42,99 +42,99 @@ justify-content: center;
align-items: center; align-items: center;
font-size: 16px; font-size: 16px;
color: #FFFFFF; color: #FFFFFF;
} }
.rc-max-width--xl{ .rc-max-width--xl{
padding: 24px 20px 24px 20px; padding: 24px 20px 24px 20px;
.rc-title { .rc-title {
display: flex; display: flex;
align-items: center; align-items: center;
color: #333333; color: #333333;
font-size: 14px;
em {
font-style: normal;
font-size: 14px; font-size: 14px;
em {
font-style: normal;
font-size: 14px;
}
span {
display: block;
margin-left: 8px;
}
} }
.rc-center{ span {
padding-top: 24px; display: block;
margin-left: 8px;
} }
}
.rc-center{
padding-top: 24px;
}
} }
.rc-address { .rc-address {
margin-top: 8px; margin-top: 8px;
text-overflow: -o-ellipsis-lastline; text-overflow: -o-ellipsis-lastline;
overflow: hidden; overflow: hidden;
text-overflow: ellipsis; text-overflow: ellipsis;
display: -webkit-box; display: -webkit-box;
-webkit-line-clamp: 2; -webkit-line-clamp: 2;
line-clamp: 2; line-clamp: 2;
-webkit-box-orient: vertical; -webkit-box-orient: vertical;
font-size: 14px; font-size: 14px;
color: #333333; color: #333333;
} }
.rc-footer { .rc-footer {
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
align-items: center; align-items: center;
margin-top: 20px; margin-top: 20px;
display: flex; display: flex;
align-items: center; align-items: center;
.rc-right { .rc-right {
span { span {
border-bottom: 1px solid #666666; border-bottom: 1px solid #666666;
}
span:first-child {
margin-right: 16px;
}
} }
img{ span:first-child {
width: 43px; margin-right: 16px;
}
.rc-foot{
display: flex;
align-items: center;
color: #333333;
font-size: 14px;
span{
margin-left: 8px;
}
} }
} }
img{
width: 43px;
}
.rc-foot{
display: flex;
align-items: center;
color: #333333;
font-size: 14px;
span{
margin-left: 8px;
}
}
}
} }
@media screen and (min-width: 769px) @media screen and (min-width: 769px)
{ {
.usercontend { .usercontend {
display:inline-block; display:inline-block;
} }
.usercontshow{ .usercontshow{
.rc-button{ .rc-button{
display: none; display: none;
} }
} }
.usercontend{ .usercontend{
margin-top: 40px; margin-top: 40px;
} }
.online{ .online{
display: none; display: none;
} }
.rc-button{ .rc-button{
display: none; display: none;
} }
.useredit{ .useredit{
width: 680px; width: 680px;
height: 164px; height: 164px;
background: #FFFFFF; background: #FFFFFF;
border: 1px solid #D7D7D7; border: 1px solid #D7D7D7;
@ -144,168 +144,167 @@ display: flex;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
img{ img{
width: 31px; width: 31px;
height: 31px; height: 31px;
} }
span{ span{
color: #333333; color: #333333;
font-size: 18px; font-size: 18px;
} }
} }
.usercontend{ .usercontend{
.useradd{ .useradd{
width: 680px; width: 680px;
height: 164px; height: 164px;
background: #FFFFFF; background: #FFFFFF;
border-radius: 3px; border-radius: 3px;
img{ img{
width: 31px; width: 31px;
height: 31px; height: 31px;
display: block; display: block;
} }
} }
} }
.rc-max-width--xl{ .rc-max-width--xl{
.rc-center{ .rc-center{
margin-top: 24px; margin-top: 24px;
margin-left: 24px; margin-left: 24px;
} }
.rc-cat{ .rc-cat{
width: 640px; width: 640px;
border: 1px solid #D7D7D7; border: 1px solid #D7D7D7;
border-radius: 3px; border-radius: 3px;
position: relative; position: relative;
margin-left: 40px; margin-left: 40px;
height: 164px; height: 164px;
} }
.rc-title { .rc-title {
display: flex; display: flex;
align-items: center; align-items: center;
color: #333333; color: #333333;
font-size: 20px;
em {
font-style: normal;
}
span {
display: block;
margin-left: 32px;
font-size: 20px; font-size: 20px;
em { }
font-style: normal; }
} .rc-footer {
display: flex;
justify-content: space-between;
align-items: center;
margin-top: 20px;
display: flex;
align-items: center;
.rc-right {
position: absolute;
right: 24px;
top: 24px;
span { span {
display: block; border-bottom: 1px solid #666666;
margin-left: 32px; }
font-size: 20px; span:first-child {
margin-right: 16px;
} }
} }
.rc-footer { img{
display: flex; width: 43px;
justify-content: space-between;
align-items: center;
margin-top: 20px;
display: flex;
align-items: center;
.rc-right {
position: absolute;
right: 24px;
top: 24px;
span {
border-bottom: 1px solid #666666;
}
span:first-child {
margin-right: 16px;
}
}
img{
width: 43px;
}
.rc-foot{
display: flex;
align-items: center;
color: #333333;
font-size: 16px;
margin-top: 16px;
span{
margin-left: 8px;
}
}
} }
.rc-foot{
} display: flex;
.rc-max-width--xl{ align-items: center;
color: #333333;
font-size: 16px;
margin-top: 16px;
span{
margin-left: 8px;
}
}
}
}
.rc-max-width--xl{
.rc-button {
height: 80px;
background: #ffffff;
box-shadow: 0px -3px 6px rgba(0, 0, 0, 0.1);
opacity: 1;
display: flex;
align-items: center;
justify-content: center;
display: block;
.rc-button { .rc-footbutton {
height: 80px; width: 164px;
background: #ffffff; height: 48px;
box-shadow: 0px -3px 6px rgba(0, 0, 0, 0.1); border: 2px solid #e2001a;
opacity: 1; opacity: 1;
border-radius: 30px;
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: center; background: #e2001a;
display: block;
.rc-footbutton {
width: 164px;
height: 48px;
border: 2px solid #e2001a;
opacity: 1;
border-radius: 30px;
display: flex;
align-items: center;
background: #e2001a;
span {
display: block;
text-align: center;
color: white;
font-size: 16px;
width: 100%;
}
}
}
.rc-header {
display: flex;
align-items: center;
color: #333333;
em {
font-style: normal;
font-size: 14px;
}
span { span {
display: block; display: block;
margin-left: 8px; text-align: center;
color: white;
font-size: 16px;
width: 100%;
} }
} }
.rc-address { }
margin-top: 16px; .rc-header {
text-overflow: -o-ellipsis-lastline; display: flex;
overflow: hidden; align-items: center;
text-overflow: ellipsis; color: #333333;
display: -webkit-box; em {
-webkit-line-clamp: 2; font-style: normal;
line-clamp: 2; font-size: 14px;
-webkit-box-orient: vertical;
font-size: 20px;
color: #333333;
} }
.rc-footer { span {
display: flex; display: block;
justify-content: space-between; margin-left: 8px;
align-items: center; }
padding-bottom: 20px; }
margin-top: 8px; .rc-address {
.rc-right { margin-top: 16px;
span { text-overflow: -o-ellipsis-lastline;
border-bottom: 1px solid #666666; overflow: hidden;
} text-overflow: ellipsis;
span:first-child { display: -webkit-box;
margin-right: 16px; -webkit-line-clamp: 2;
line-clamp: 2;
} -webkit-box-orient: vertical;
font-size: 20px;
color: #333333;
}
.rc-footer {
display: flex;
justify-content: space-between;
align-items: center;
padding-bottom: 20px;
margin-top: 8px;
.rc-right {
span {
border-bottom: 1px solid #666666;
}
span:first-child {
margin-right: 16px;
} }
} }
}
} }
} }

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.4 KiB

View File

@ -41,6 +41,7 @@ export default {
props:["defaultValues"], props:["defaultValues"],
data(){ data(){
return{ return{
animationTimer:undefined,
displayValue:"", displayValue:"",
returnValue:"", returnValue:"",
returnValueArr:[], returnValueArr:[],
@ -162,7 +163,7 @@ export default {
if(obj.id.indexOf(provinceId)<0) if(obj.id.indexOf(provinceId)<0)
{ {
console.log('500 : error via checking validatePickedValues'); console.log('500 : error via checking validatePickedValues');
_self.returnValueArr[index]={}; _self.returnValueArr.splice(index,1);
} }
else else
{ {
@ -176,7 +177,7 @@ export default {
if(areaId && obj.id.indexOf(areaId)<0) if(areaId && obj.id.indexOf(areaId)<0)
{ {
console.log('501 : error via checking validatePickedValues'); console.log('501 : error via checking validatePickedValues');
_self.returnValueArr[index]={}; _self.returnValueArr.splice(index,1);
} }
else{ else{
validatedIndex=index; validatedIndex=index;
@ -234,9 +235,15 @@ export default {
//TODO show warning here //TODO show warning here
let errorEle=document.querySelector(".ts-area-picker-values"); let errorEle=document.querySelector(".ts-area-picker-values");
errorEle.classList.add("error"); errorEle.classList.add("error");
setTimeout(function(){ let _self = this;
errorEle.classList.remove("error"); if(!this.animationTimer)
},2000); {
this.animationTimer = setTimeout(function(){
errorEle.classList.remove("error");
clearTimeout(_self.animationTimer);
_self.animationTimer=undefined;
},2000);
}
tabIndex=lastValidatedTabIndex+1; tabIndex=lastValidatedTabIndex+1;
} }
this.curDisplayingColIndex=tabIndex; this.curDisplayingColIndex=tabIndex;
@ -308,6 +315,23 @@ export default {
.ts-area-picker-values{ .ts-area-picker-values{
width:100%; width:100%;
height:100%; height:100%;
&.error{
position:relative;
width:100%;
height:78%;
&:after{
content: " ";
position:absolute;
width:100%;
height:100%;
left:0;
top:0;
animation-name: flash-error;
animation-iteration-count: 2;
animation-duration: .5s;
animation-direction: forwards;
}
}
ul{ ul{
padding:1rem 2.5rem 2rem 2.5rem; padding:1rem 2.5rem 2rem 2.5rem;
margin:0; margin:0;
@ -400,10 +424,12 @@ export default {
@keyframes flash-error @keyframes flash-error
{ {
from { from {
opacity:.6; opacity:0;
background-color:#fff;
} }
to { to {
opacity:.3; opacity:.3;
background-color:#E2001A;
} }
} }
</style> </style>

View File

@ -58,11 +58,6 @@
</span> </span>
</button> </button>
--> -->
<a href="#" data-modal-trigger="modal-whereToBuy" onclick='bindTracking(this)' evt-name='页内弹窗' evt-cat='headerBtnClick' evt-val='在哪购买' class="rc-btn rc-btn--icon rc-icon rc-pin--xs rc-iconography rc-interactive rc-xs-up" aria-label="pin">
<span class="rc-screen-reader-text">
translations.feature.headerbar.pin
</span>
</a>
<button data-js-trigger="search-bar" @click='searchturn' evt-name='页内弹窗' evt-cat='headerBtnClick' evt-val='全文搜索' class="rc-btn rc-btn--icon rc-icon rc-search--xs rc-iconography rc-interactive" aria-label="Search" role="menuitem" data-click-modifier=".rc-hidden"> <button data-js-trigger="search-bar" @click='searchturn' evt-name='页内弹窗' evt-cat='headerBtnClick' evt-val='全文搜索' class="rc-btn rc-btn--icon rc-icon rc-search--xs rc-iconography rc-interactive" aria-label="Search" role="menuitem" data-click-modifier=".rc-hidden">
<span class="rc-screen-reader-text">translations.feature.headerbar.search</span> <span class="rc-screen-reader-text">translations.feature.headerbar.search</span>
</button> </button>
@ -75,16 +70,16 @@
<div class="rc-container"> <div class="rc-container">
<ul class="rc-list rc-list--blank rc-list--inline rc-list--align rc-header__center"> <ul class="rc-list rc-list--blank rc-list--inline rc-list--align rc-header__center">
<li class="rc-list__item"> <li class="rc-list__item">
<a href="#cats" class="rc-list__header" data-ref="nav-link" role="menuitem" title="猫"></a> <a href="https://royalcanin.com.cn/cats" class="rc-list__header" data-ref="nav-link" role="menuitem" title="猫"></a>
</li> </li>
<li class="rc-list__item"> <li class="rc-list__item">
<a href="#dogs" class="rc-list__header" data-ref="nav-link" role="menuitem" title="犬"></a> <a href="https://royalcanin.com.cn/dogs" class="rc-list__header" data-ref="nav-link" role="menuitem" title="犬"></a>
</li> </li>
<li class="rc-list__item"> <li class="rc-list__item">
<a href="#tailored-nutrition" class="rc-list__header" data-ref="nav-link" role="menuitem" title="定制营养方案">定制营养方案</a> <a href="#/tailored-nutrition" class="rc-list__header" data-ref="nav-link" role="menuitem" title="定制营养方案">定制营养方案</a>
</li> </li>
<li class="rc-list__item"> <li class="rc-list__item">
<a href="#about" class="rc-list__header" data-ref="nav-link" role="menuitem" title="关于我们">关于我们</a> <a href="https://royalcanin.com.cn/about" class="rc-list__header" data-ref="nav-link" role="menuitem" title="关于我们">关于我们</a>
</li> </li>
</ul> </ul>
<div class="submenu rc-layout-container rc-one-column rc-margin--none rc-xl-up"> <div class="submenu rc-layout-container rc-one-column rc-margin--none rc-xl-up">
@ -94,49 +89,49 @@
<li class="rc-list__item rc-list__item--group"> <li class="rc-list__item rc-list__item--group">
<img src="../assets/showimage/sub-nav-1.jpg" class="ts-head-img rc-margin-bottom--xs"> <img src="../assets/showimage/sub-nav-1.jpg" class="ts-head-img rc-margin-bottom--xs">
<a href="#cats" class="rc-list__header rc-margin--none" role="menuitem"></a> <a href="https://royalcanin.com.cn/cats" class="rc-list__header rc-margin--none" role="menuitem"></a>
<ul class="rc-list rc-list--blank rc-list--align test" role="menu"> <ul class="rc-list rc-list--blank rc-list--align test" role="menu">
<li class="rc-list__item"> <li class="rc-list__item">
<a href="#cats/products" class="rc-list__link" role="menuitem">产品</a> <a href="#/cats/products" class="rc-list__link" role="menuitem">产品</a>
</li> </li>
<li class="rc-list__item"> <li class="rc-list__item">
<a href="#cats/breeds" class="rc-list__link" role="menuitem">品种</a> <a href="https://royalcanin.com.cn/cats/breeds" class="rc-list__link" role="menuitem">品种</a>
</li> </li>
<li class="rc-list__item"> <li class="rc-list__item">
<a href="#cats/getting-a-kitten" class="rc-list__link" role="menuitem">想养猫吗</a> <a href="https://royalcanin.com.cn/cats/getting-a-kitten" class="rc-list__link" role="menuitem">想养猫吗</a>
</li> </li>
<li class="rc-list__item"> <li class="rc-list__item">
<a href="#cats/kitten" class="rc-list__link" role="menuitem">幼猫</a> <a href="https://royalcanin.com.cn/cats/kitten" class="rc-list__link" role="menuitem">幼猫</a>
</li> </li>
<li class="rc-list__item"> <li class="rc-list__item">
<a href="#cats/kitten/health" class="rc-list__link" role="menuitem">健康和心情</a> <a href="https://royalcanin.com.cn/cats/kitten/health" class="rc-list__link" role="menuitem">健康和心情</a>
</li> </li>
</ul> </ul>
</li> </li>
<li class="rc-list__item rc-list__item--group"> <li class="rc-list__item rc-list__item--group">
<img src="../assets/showimage/sub-nav-2.jpg" class="ts-head-img rc-margin-bottom--xs"> <img src="../assets/showimage/sub-nav-2.jpg" class="ts-head-img rc-margin-bottom--xs">
<a href="#dogs" class="rc-list__header rc-margin--none" role="menuitem"></a> <a href="https://royalcanin.com.cn/dogs" class="rc-list__header rc-margin--none" role="menuitem"></a>
<ul class="rc-list rc-list--blank rc-list--align test" role="menu"> <ul class="rc-list rc-list--blank rc-list--align test" role="menu">
<li class="rc-list__item"> <li class="rc-list__item">
<a href="#dogs/products" class="rc-list__link" role="menuitem">产品</a> <a href="#dogs/products" class="rc-list__link" role="menuitem">产品</a>
</li> </li>
<li class="rc-list__item"> <li class="rc-list__item">
<a href="#dogs/breeds" class="rc-list__link" role="menuitem">品种</a> <a href="https://royalcanin.com.cn/dogs/breeds" class="rc-list__link" role="menuitem">品种</a>
</li> </li>
<li class="rc-list__item"> <li class="rc-list__item">
<a href="#dogs/getting-a-puppy" class="rc-list__link" role="menuitem">想养只狗</a> <a href="https://royalcanin.com.cn/dogs/getting-a-puppy" class="rc-list__link" role="menuitem">想养只狗</a>
</li> </li>
<li class="rc-list__item"> <li class="rc-list__item">
<a href="#dogs/puppy" class="rc-list__link" role="menuitem">幼犬</a> <a href="https://royalcanin.com.cn/dogs/puppy" class="rc-list__link" role="menuitem">幼犬</a>
</li> </li>
<li class="rc-list__item"> <li class="rc-list__item">
<a href="#dogs/puppy/health" class="rc-list__link" role="menuitem">健康和心情</a> <a href="https://royalcanin.com.cn/dogs/puppy/health" class="rc-list__link" role="menuitem">健康和心情</a>
</li> </li>
</ul> </ul>
</li> </li>
<li class="rc-list__item rc-list__item--group"> <li class="rc-list__item rc-list__item--group">
<img src="../assets/showimage/sub-nav-3.jpg" class="ts-head-img rc-margin-bottom--xs"> <img src="../assets/showimage/sub-nav-3.jpg" class="ts-head-img rc-margin-bottom--xs">
<a href="#tailored-nutrition" class="rc-list__header rc-margin--none" role="menuitem">定制营养方案</a> <a href="/" class="rc-list__header rc-margin--none" role="menuitem">定制营养方案</a>
<ul class="rc-list rc-list--blank rc-list--align test" role="menu"> <ul class="rc-list rc-list--blank rc-list--align test" role="menu">
<li class="rc-list__item"> <li class="rc-list__item">
<a href="#cats/products" class="rc-list__link" role="menuitem">猫系列</a> <a href="#cats/products" class="rc-list__link" role="menuitem">猫系列</a>
@ -148,13 +143,13 @@
</li> </li>
<li class="rc-list__item rc-list__item--group"> <li class="rc-list__item rc-list__item--group">
<img src="../assets/showimage/sub-nav-4.jpg" class="ts-head-img rc-margin-bottom--xs"> <img src="../assets/showimage/sub-nav-4.jpg" class="ts-head-img rc-margin-bottom--xs">
<a href="#about" class="rc-list__header rc-margin--none" role="menuitem">关于我们</a> <a href="https://royalcanin.com.cn/about" class="rc-list__header rc-margin--none" role="menuitem">关于我们</a>
<ul class="rc-list rc-list--blank rc-list--align test" role="menu"> <ul class="rc-list rc-list--blank rc-list--align test" role="menu">
<li class="rc-list__item"> <li class="rc-list__item">
<a href="#about#growth-phase1" class="rc-list__link" role="menuitem">我们的历史</a> <a href="https://royalcanin.com.cn/about#growth-phase1" class="rc-list__link" role="menuitem">我们的历史</a>
</li> </li>
<li class="rc-list__item"> <li class="rc-list__item">
<a href="#about" class="rc-list__link" role="menuitem">我们的价值观</a> <a href="https://royalcanin.com.cn/about" class="rc-list__link" role="menuitem">我们的价值观</a>
</li> </li>
<!-- <!--
<li class="rc-list__item"> <li class="rc-list__item">
@ -196,74 +191,74 @@
<section class="rc-max-width--xl"> <section class="rc-max-width--xl">
<div class="rc-column rc-lg-up rc-padding--lg"> <div class="rc-column rc-lg-up rc-padding--lg">
<h1 class="rc-gamma rc-padding-x--md">帮助猫狗过最健康的生活</h1> <h1 class="rc-gamma rc-padding-x--md">帮助猫狗过最健康的生活</h1>
<img class="rc-padding--sm" src="#profiles/custom/royal_canin_profile/themes/royal_canin/images/yorkshire-terrier-sacred-birman-b-w-brand-emblematic-tailored-nutrition-hero.jpg" alt="Royal Canin China" /> <img class="rc-padding--sm" src="/images/yorkshire-terrier-sacred-birman-b-w-brand-emblematic-tailored-nutrition-hero.jpg" alt="Royal Canin China" />
</div> </div>
<nav class="rc-nav rc-hidden" data-toggle-group="mobile" data-toggle-effect="rc-expand--horizontal" data-js-target="mobile-push-nav"> <nav class="rc-nav rc-hidden" data-toggle-group="mobile" data-toggle-effect="rc-expand--horizontal" data-js-target="mobile-push-nav">
<div class="rc-layout-container rc-three-column"> <div class="rc-layout-container rc-three-column">
<div class="rc-column rc-double-width rc-padding-x--none--mobile rc-padding-right--none"> <div class="rc-column rc-double-width rc-padding-x--none--mobile rc-padding-right--none">
<ul class="rc-list rc-list--blank rc-list--align rc-list--two-column" role="menubar"> <ul class="rc-list rc-list--blank rc-list--align rc-list--two-column" role="menubar">
<li class="rc-list__item rc-list__item--group"> <li class="rc-list__item rc-list__item--group">
<a href="#cats" class="rc-list__header" id="mega-nav-header-1" data-toggle="nav-list-1" role="menuitem"></a> <a href="https://royalcanin.com.cn/cats" class="rc-list__header" id="mega-nav-header-1" data-toggle="nav-list-1" role="menuitem"></a>
<ul class="rc-list rc-list--blank rc-list--align" id="nav-list-1" aria-labelledby="mega-nav-menu-1" role="menu"> <ul class="rc-list rc-list--blank rc-list--align" id="nav-list-1" aria-labelledby="mega-nav-menu-1" role="menu">
<li class="rc-list__item rc-md-down"> <li class="rc-list__item rc-md-down">
<button class="rc-list__link rc-icon rc-left--xs rc-iconography" data-toggle="nav-list-1" role="button">返回</button> <button class="rc-list__link rc-icon rc-left--xs rc-iconography" data-toggle="nav-list-1" role="button">返回</button>
</li> </li>
<li class="rc-list__item rc-md-down"> <li class="rc-list__item rc-md-down">
<a href="#cats" class="rc-list__header" title="Cat" role="menuitem"></a> <a href="https://royalcanin.com.cn/cats" class="rc-list__header" title="Cat" role="menuitem"></a>
</li> </li>
<li class="rc-list__item"> <li class="rc-list__item">
<a href="#cats/products" class="rc-list__link ca" role="menuitem" title="Products">产品</a> <a href="#cats/products" class="rc-list__link ca" role="menuitem" title="Products">产品</a>
</li> </li>
<li class="rc-list__item"> <li class="rc-list__item">
<a href="#cats/breeds" class="rc-list__link ca" role="menuitem" title="Breeds">品种</a> <a href="https://royalcanin.com.cn/cats/breeds" class="rc-list__link ca" role="menuitem" title="Breeds">品种</a>
</li> </li>
<li class="rc-list__item"> <li class="rc-list__item">
<a href="#cats/getting-a-kitten" class="rc-list__link ca" role="menuitem" title="Thinking of getting a cat">想养只猫</a> <a href="https://royalcanin.com.cn/cats/getting-a-kitten" class="rc-list__link ca" role="menuitem" title="Thinking of getting a cat">想养只猫</a>
</li> </li>
<li class="rc-list__item"> <li class="rc-list__item">
<a href="#cats/kitten" class="rc-list__link ca" role="menuitem" title="Kitten">幼猫</a> <a href="https://royalcanin.com.cn/cats/kitten" class="rc-list__link ca" role="menuitem" title="Kitten">幼猫</a>
</li> </li>
<li class="rc-list__item"> <li class="rc-list__item">
<a href="#cats/kitten/health" class="rc-list__link ca" role="menuitem" title="Health and wellbeing">健康和心情</a> <a href="https://royalcanin.com.cn/cats/kitten/health" class="rc-list__link ca" role="menuitem" title="Health and wellbeing">健康和心情</a>
</li> </li>
</ul> </ul>
</li> </li>
<li class="rc-list__item rc-list__item--group"> <li class="rc-list__item rc-list__item--group">
<a href="#dogs" class="rc-list__header" role="menuitem" id="mega-nav-header-2" data-toggle="nav-list-2"></a> <a href="https://royalcanin.com.cn/dogs" class="rc-list__header" role="menuitem" id="mega-nav-header-2" data-toggle="nav-list-2"></a>
<ul class="rc-list rc-list--blank rc-list--align" id="nav-list-2" aria-labelledby="mega-nav-menu-2" role="menu"> <ul class="rc-list rc-list--blank rc-list--align" id="nav-list-2" aria-labelledby="mega-nav-menu-2" role="menu">
<li class="rc-list__item rc-md-down"> <li class="rc-list__item rc-md-down">
<button class="rc-list__link rc-icon rc-left--xs rc-iconography" data-toggle="nav-list-2" role="button">返回</button> <button class="rc-list__link rc-icon rc-left--xs rc-iconography" data-toggle="nav-list-2" role="button">返回</button>
</li> </li>
<li class="rc-list__item rc-md-down"> <li class="rc-list__item rc-md-down">
<a href="#dogs" class="rc-list__header" title="Dog" role="menuitem"></a> <a href="https://royalcanin.com.cn/dogs" class="rc-list__header" title="Dog" role="menuitem"></a>
</li> </li>
<li class="rc-list__item"> <li class="rc-list__item">
<a href="#dogs/products" class="rc-list__link ca" role="menuitem" title="Products">产品</a> <a href="#dogs/products" class="rc-list__link ca" role="menuitem" title="Products">产品</a>
</li> </li>
<li class="rc-list__item"> <li class="rc-list__item">
<a href="#dogs/breeds" class="rc-list__link ca" role="menuitem" title="Breeds">品种</a> <a href="https://royalcanin.com.cn/dogs/breeds" class="rc-list__link ca" role="menuitem" title="Breeds">品种</a>
</li> </li>
<li class="rc-list__item"> <li class="rc-list__item">
<a href="#dogs/getting-a-puppy" class="rc-list__link ca" role="menuitem" title="Thinking of getting a dog">想养只犬</a> <a href="https://royalcanin.com.cn/dogs/getting-a-puppy" class="rc-list__link ca" role="menuitem" title="Thinking of getting a dog">想养只犬</a>
</li> </li>
<li class="rc-list__item"> <li class="rc-list__item">
<a href="#dogs/puppy" class="rc-list__link ca" role="menuitem" title="Puppy">幼犬</a> <a href="https://royalcanin.com.cn/dogs/puppy" class="rc-list__link ca" role="menuitem" title="Puppy">幼犬</a>
</li> </li>
<li class="rc-list__item"> <li class="rc-list__item">
<a href="#dogs/puppy/health" class="rc-list__link ca" role="menuitem" title="Health and wellbeing">健康和心情</a> <a href="https://royalcanin.com.cn/dogs/puppy/health" class="rc-list__link ca" role="menuitem" title="Health and wellbeing">健康和心情</a>
</li> </li>
</ul> </ul>
</li> </li>
<li class="rc-list__item rc-list__item--group"> <li class="rc-list__item rc-list__item--group">
<a href="#tailored-nutrition" class="rc-list__header" role="menuitem" id="mega-nav-header-3" data-toggle="nav-list-3">定制营养方案</a> <a href="https://royalcanin.com.cn/tailored-nutrition" class="rc-list__header" role="menuitem" id="mega-nav-header-3" data-toggle="nav-list-3">定制营养方案</a>
<ul class="rc-list rc-list--blank rc-list--align" id="nav-list-3" aria-labelledby="mega-nav-menu-3" role="menu"> <ul class="rc-list rc-list--blank rc-list--align" id="nav-list-3" aria-labelledby="mega-nav-menu-3" role="menu">
<li class="rc-list__item rc-md-down"> <li class="rc-list__item rc-md-down">
<button class="rc-list__link rc-icon rc-left--xs rc-iconography" data-toggle="nav-list-3" role="button">返回</button> <button class="rc-list__link rc-icon rc-left--xs rc-iconography" data-toggle="nav-list-3" role="button">返回</button>
</li> </li>
<li class="rc-list__item rc-md-down"> <li class="rc-list__item rc-md-down">
<a href="#tailored-nutrition" class="rc-list__header" title="Nutrition" role="menuitem">定制营养方案</a> <a href="https://royalcanin.com.cn/tailored-nutrition" class="rc-list__header" title="Nutrition" role="menuitem">定制营养方案</a>
</li> </li>
<li class="rc-list__item"> <li class="rc-list__item">
<a href="#cats/products" class="rc-list__link ca" role="menuitem">猫系列</a> <a href="#cats/products" class="rc-list__link ca" role="menuitem">猫系列</a>
@ -275,16 +270,16 @@
</li> </li>
<li class="rc-list__item rc-list__item--group"> <li class="rc-list__item rc-list__item--group">
<a href="#about" class="rc-list__header" role="menuitem" id="mega-nav-header-4" data-toggle="nav-list-4">关于我们</a> <a href="https://royalcanin.com.cn/about" class="rc-list__header" role="menuitem" id="mega-nav-header-4" data-toggle="nav-list-4">关于我们</a>
<ul class="rc-list rc-list--blank rc-list--align" id="nav-list-4" aria-labelledby="mega-nav-menu-4" role="menu"> <ul class="rc-list rc-list--blank rc-list--align" id="nav-list-4" aria-labelledby="mega-nav-menu-4" role="menu">
<li class="rc-list__item rc-md-down"> <li class="rc-list__item rc-md-down">
<button class="rc-list__link rc-icon rc-left--xs rc-iconography" data-toggle="nav-list-4" role="button">返回</button> <button class="rc-list__link rc-icon rc-left--xs rc-iconography" data-toggle="nav-list-4" role="button">返回</button>
</li> </li>
<li class="rc-list__item rc-md-down"> <li class="rc-list__item rc-md-down">
<a href="#about" class="rc-list__header" title="About" role="menuitem">关于我们</a> <a href="https://royalcanin.com.cn/about" class="rc-list__header" title="About" role="menuitem">关于我们</a>
</li> </li>
<li class="rc-list__item"> <li class="rc-list__item">
<a href="#about#growth-phase1" class="rc-list__link ca" role="menuitem" title="Our history">我们的历史</a> <a href="https://royalcanin.com.cn/about#growth-phase1" class="rc-list__link ca" role="menuitem" title="Our history">我们的历史</a>
</li> </li>
<!-- <!--
<li class="rc-list__item"> <li class="rc-list__item">
@ -311,15 +306,10 @@
<div class="rc-column rc-padding-x--none"> <div class="rc-column rc-padding-x--none">
<ul class="rc-list rc-list--blank rc-list--align rc-btn-offset--top" role="menu"> <ul class="rc-list rc-list--blank rc-list--align rc-btn-offset--top" role="menu">
<li class="rc-list__item"> <li class="rc-list__item">
<a class="rc-list__link rc-icon rc-email--xs rc-iconography--xs" role="menuitem" href="#about/contact"> <a class="rc-list__link rc-icon rc-email--xs rc-iconography--xs" role="menuitem" href="https://royalcanin.com.cn/about/contact">
与我们联系 与我们联系
</a> </a>
</li> </li>
<li class="rc-list__item">
<a class="rc-list__link rc-icon rc-pin--xs rc-iconography--xs" data-modal-trigger="modal-whereToBuy" onclick='bindTracking(this)' evt-name='页内弹窗' evt-cat='headerBtnClick' evt-val='在哪购买' role="menuitem" href="#">
在哪里购买
</a>
</li>
<li class="rc-list__item"> <li class="rc-list__item">
<a class="rc-list__link rc-icon rc-language--xs ts-weibo--xs" role="menuitem" target='_blank' href="https://weibo.com/chinaroyalcanin?topnav=1&wvr=6&topsug=1&is_all=1"> <a class="rc-list__link rc-icon rc-language--xs ts-weibo--xs" role="menuitem" target='_blank' href="https://weibo.com/chinaroyalcanin?topnav=1&wvr=6&topsug=1&is_all=1">
微博 微博
@ -349,39 +339,9 @@
</section> </section>
</div> </div>
<!-- Popup menu end--> <!-- Popup menu end-->
</div>
<!-- Where to buy modal -->
<aside role="modal" class="rc-modal rc-hidden" data-modal-target="modal-whereToBuy">
<div class="rc-modal__container">
<header class="rc-modal__header">
<button class="rc-btn rc-icon rc-btn--icon-label rc-modal__close rc-close--xs rc-iconography" data-modal-trigger="modal-whereToBuy">关闭</button>
</header>
<section class="rc-modal__content rc-scroll--y">
<div class="rc-margin-top--md">
<h2 class="rc-gamma rc-text--center">我能在哪买到Royal Canin 的产品</h2>
<p class='rc-text--center'>
您可以点击下面的链接进入到我们的电商店铺
<br />
</p>
</div>
<div class="rc-btn-group">
<a href="https://royalcanin.tmall.com/shop/view_shop.htm?spm=a1z10.3-b-s.w5001-17212536142.3.1284526cyHC5If&scene=taobao_shop" target='_blank' class="rc-btn rc-btn--one ts-flex-center">
<img src="#profiles/custom/royal_canin_profile/themes/royal_canin/images/tm-logo.png" alt="天猫旗舰店" />
</a>
<a href="https://mall.jd.com/index-650686.html" class="rc-btn rc-btn--one ts-flex-center ts-btn-img--70" target='_blank'>
<img src="#profiles/custom/royal_canin_profile/themes/royal_canin/images/jd-logo.png" alt="京东旗舰店" />
</a>
</div>
</section>
</div>
</aside>
<!-- Where to buy modal end -->
</div>
</template> </template>
<script> <script>
const isReload={
needload:false
};
export default { export default {
data() { data() {
return { return {
@ -404,10 +364,10 @@ export default {
this.usermessage=usernot; this.usermessage=usernot;
} }
//debugger; //debugger;
if(isReload.needload) if(isInitialized)
location.reload(); location.reload();
if(isReload.needload==false) if(!isInitialized)
isReload.needload=true; isInitialized=true;
//console.log(this.loginornot); //console.log(this.loginornot);
/* /*
if(RCDL && RCDL.utilities && RCDL.navigation && RCDL.navigation.rebuild) if(RCDL && RCDL.utilities && RCDL.navigation && RCDL.navigation.rebuild)

View File

@ -1,69 +1,55 @@
<template> <template>
<footer class="rc-bg-colour--interface-dark rc-padding-bottom--sm" role="contentinfo"> <footer class="rc-bg-colour--interface-dark rc-padding-bottom--sm" role="contentinfo">
<div class="rc-max-width--lg rc-scroll--y"> <div class="rc-max-width--lg rc-scroll--y">
<div class="footer-block1 rc-layout-container rc-five-column rc-padding-x--xs rc-border-colour--interface rc-md-up rc-padding-left--none">
<div class="rc-column rc-padding-left--none" data-component="nav-track" data-nav-name="Footer navigation">
<nav class="rc-menubar">
<ul class="rc-list rc-list--blank rc-list--inverse" style="background-color: transparent;">
<li class="rc-list__item">
<a href="javascript:;" class="rc-list__link rc-btn rc-btn--inverse rc-btn--icon-label rc-icon rc-pin--xs rc-brand3" data-ref="nav-link" role="menuitem" title="Where to buy" data-modal-trigger="modal-whereToBuy" onclick='bindTracking(this)' evt-name='页内弹窗' evt-cat='footerBtnClick' evt-val='在哪购买'>在哪里购买</a>
</li>
</ul>
</nav>
</div>
</div>
<div class="rc-divider rc-md-up"></div>
<div class="footer-block2 rc-layout-container rc-three-column rc-padding-x--xs rc-border-colour--interface"> <div class="footer-block2 rc-layout-container rc-three-column rc-padding-x--xs rc-border-colour--interface">
<div class="rc-column rc-double-width rc-padding-x--xs"> <div class="rc-column rc-double-width rc-padding-x--xs">
<nav class="rc-padding-x--xs" data-toggle-group="mobile" data-toggle-effect="rc-expand--vertical" role="navigation" data-component="nav-track" data-nav-name="Footer navigation"> <nav class="rc-padding-x--xs" data-toggle-group="mobile" data-toggle-effect="rc-expand--vertical" role="navigation" data-component="nav-track" data-nav-name="Footer navigation">
<ul class="rc-list ts-list--four-column rc-list--blank rc-list--align rc-list--inverse" role="menubar"> <ul class="rc-list ts-list--four-column rc-list--blank rc-list--align rc-list--inverse" role="menubar">
<li class="rc-list__item rc-list__item--group" role="none"> <li class="rc-list__item rc-list__item--group" role="none">
<a href="#cats" class="rc-list__header" role="menuitem" id="nav-footer-top-1" data-toggle="nav-footer-1"></a> <a href="https://royalcanin.com.cn/cats" class="rc-list__header" role="menuitem" id="nav-footer-top-1" data-toggle="nav-footer-1"></a>
<ul class="rc-list rc-list--blank rc-list--align" role="menu" id="nav-footer-1" aria-labelledby="nav-footer-top-1"> <ul class="rc-list rc-list--blank rc-list--align" role="menu" id="nav-footer-1" aria-labelledby="nav-footer-top-1">
<li class="rc-list__item"> <li class="rc-list__item">
<a href="#cats/breeds" class="rc-list__link" data-ref="nav-link" role="menuitem" title="Products">产品</a> <a href="#cats/breeds" class="rc-list__link" data-ref="nav-link" role="menuitem" title="Products">产品</a>
</li> </li>
<li class="rc-list__item"> <li class="rc-list__item">
<a href="#cats/breeds" class="rc-list__link" data-ref="nav-link" role="menuitem" title="Breeds">品种</a> <a href="https://royalcanin.com.cn/cats/breeds" class="rc-list__link" data-ref="nav-link" role="menuitem" title="Breeds">品种</a>
</li> </li>
<li class="rc-list__item"> <li class="rc-list__item">
<a href="#cats/getting-a-kitten" class="rc-list__link" data-ref="nav-link" role="menuitem" title="Thinking of getting a cat">想养只猫</a> <a href="https://royalcanin.com.cn/cats/getting-a-kitten" class="rc-list__link" data-ref="nav-link" role="menuitem" title="Thinking of getting a cat">想养只猫</a>
</li> </li>
<li class="rc-list__item"> <li class="rc-list__item">
<a href="#cats/kitten" class="rc-list__link" data-ref="nav-link" role="menuitem" title="Kitten">幼猫</a> <a href="https://royalcanin.com.cn/cats/kitten" class="rc-list__link" data-ref="nav-link" role="menuitem" title="Kitten">幼猫</a>
</li> </li>
<li class="rc-list__item"> <li class="rc-list__item">
<a href="#cats/kitten/health" class="rc-list__link" data-ref="nav-link" role="menuitem" title="Health and wellbeing">健康和心情</a> <a href="https://royalcanin.com.cn/cats/kitten/health" class="rc-list__link" data-ref="nav-link" role="menuitem" title="Health and wellbeing">健康和心情</a>
</li> </li>
</ul> </ul>
</li> </li>
<li class="rc-list__item rc-list__item--group" role="none"> <li class="rc-list__item rc-list__item--group" role="none">
<a href="#dogs" class="rc-list__header" role="menuitem" id="nav-footer-top-2" data-toggle="nav-footer-2"> <a href="https://royalcanin.com.cn/dogs" class="rc-list__header" role="menuitem" id="nav-footer-top-2" data-toggle="nav-footer-2"
>
</a> </a>
<ul class="rc-list rc-list--blank rc-list--align" id="nav-footer-2" aria-labelledby="nav-footer-top-2" role="menu"> <ul class="rc-list rc-list--blank rc-list--align" id="nav-footer-2" aria-labelledby="nav-footer-top-2" role="menu">
<li class="rc-list__item"> <li class="rc-list__item">
<a href="#dogs/breeds" class="rc-list__link" data-ref="nav-link" role="menuitem" title="Products">产品</a> <a href="#dogs/breeds" class="rc-list__link" data-ref="nav-link" role="menuitem" title="Products">产品</a>
</li> </li>
<li class="rc-list__item"> <li class="rc-list__item">
<a href="#dogs/breeds" class="rc-list__link" data-ref="nav-link" role="menuitem" title="Breeds">品种</a> <a href="https://royalcanin.com.cn/dogs/breeds" class="rc-list__link" data-ref="nav-link" role="menuitem" title="Breeds">品种</a>
</li> </li>
<li class="rc-list__item"> <li class="rc-list__item">
<a href="#dogs/getting-a-puppy" class="rc-list__link" data-ref="nav-link" role="menuitem" title="Thinking of getting a dog">想养只犬</a> <a href="https://royalcanin.com.cn/dogs/getting-a-puppy" class="rc-list__link" data-ref="nav-link" role="menuitem" title="Thinking of getting a dog">想养只犬</a>
</li> </li>
<li class="rc-list__item"> <li class="rc-list__item">
<a href="#dogs/puppy" class="rc-list__link" data-ref="nav-link" role="menuitem" title="Puppy">幼犬</a> <a href="https://royalcanin.com.cn/dogs/puppy" class="rc-list__link" data-ref="nav-link" role="menuitem" title="Puppy">幼犬</a>
</li> </li>
<li class="rc-list__item"> <li class="rc-list__item">
<a href="#dogs/puppy/health" class="rc-list__link" data-ref="nav-link" role="menuitem" title="Health and wellbeing">健康和心情</a> <a href="https://royalcanin.com.cn/dogs/puppy/health" class="rc-list__link" data-ref="nav-link" role="menuitem" title="Health and wellbeing">健康和心情</a>
</li> </li>
</ul> </ul>
</li> </li>
<li class="rc-list__item rc-list__item--group" role="none"> <li class="rc-list__item rc-list__item--group" role="none">
<a href="#tailored-nutrition" class="rc-list__header" role="menuitem" id="nav-footer-top-3" data-toggle="nav-footer-3"> <a href="#tailored-nutrition" class="rc-list__header" role="menuitem" id="nav-footer-top-3" data-toggle="nav-footer-3"
定制营养方案 >定制营养方案
</a> </a>
<ul class="rc-list rc-list--blank rc-list--align" id="nav-footer-3" aria-labelledby="nav-footer-top-3" role="menu"> <ul class="rc-list rc-list--blank rc-list--align" id="nav-footer-3" aria-labelledby="nav-footer-top-3" role="menu">
<li class="rc-list__item"> <li class="rc-list__item">
@ -75,15 +61,15 @@
</ul> </ul>
</li> </li>
<li class="rc-list__item rc-list__item--group" role="none"> <li class="rc-list__item rc-list__item--group" role="none">
<a href="#about" class="rc-list__header" id="nav-footer-top-4" data-toggle="nav-footer-4" role="menuitem"> <a href="https://royalcanin.com.cn/about" class="rc-list__header" id="nav-footer-top-4" data-toggle="nav-footer-4" role="menuitem"
关于我们 >关于我们
</a> </a>
<ul class="rc-list rc-list--blank rc-list--align" id="nav-footer-4" aria-labelledby="nav-footer-top-4" role="menu"> <ul class="rc-list rc-list--blank rc-list--align" id="nav-footer-4" aria-labelledby="nav-footer-top-4" role="menu">
<li class="rc-list__item"> <li class="rc-list__item">
<a href="#about#growth-phase1" class="rc-list__link" data-ref="nav-link" role="menuitem" title="Our history">我们的历史</a> <a href="https://royalcanin.com.cn/about#growth-phase1" class="rc-list__link" data-ref="nav-link" role="menuitem" title="Our history">我们的历史</a>
</li> </li>
<li class="rc-list__item"> <li class="rc-list__item">
<a href="#about" class="rc-list__link" data-ref="nav-link" role="menuitem" title="Our values">我们的价值观</a> <a href="https://royalcanin.com.cn/about" class="rc-list__link" data-ref="nav-link" role="menuitem" title="Our values">我们的价值观</a>
</li> </li>
</ul> </ul>
@ -98,9 +84,6 @@
<div class="rc-layout-container rc-one-column rc-md-down"> <div class="rc-layout-container rc-one-column rc-md-down">
<div class="rc-column rc-padding-x--none"> <div class="rc-column rc-padding-x--none">
<a href="javascript:;" data-modal-trigger="modal-whereToBuy" onclick='bindTracking(this)' evt-name='页内弹窗' evt-cat='footererBtnClick' evt-val='在哪购买' class="rc-btn rc-btn--inverse rc-btn--icon-label rc-icon rc-bag--xs rc-brand3" title="Where to buy" role="menuitem">
在哪购买
</a>
<!-- <!--
<a class="rc-btn rc-btn--inverse rc-btn--icon-label rc-icon rc-language--xs rc-brand3" role="menuitem" data-modal-trigger="country-lang-selector"> <a class="rc-btn rc-btn--inverse rc-btn--icon-label rc-icon rc-language--xs rc-brand3" role="menuitem" data-modal-trigger="country-lang-selector">
Language Language
@ -222,7 +205,7 @@
<br/> <br/>
<a target='_blank' href='https://royalcanin.com.cn/#privacy'><span class="">隐私声明</span></a> <a target='_blank' href='https://royalcanin.com.cn/#privacy'><span class="">隐私声明</span></a>
&nbsp; | &nbsp; &nbsp; | &nbsp;
<a target='_blank' href='#declaration'><span class="">法律声明</span></a> <a target='_blank' href='https://royalcanin.com.cn/declaration'><span class="">法律声明</span></a>
</div> </div>
</div> </div>

View File

@ -4,10 +4,10 @@ export default {
// Global page headers: https://go.nuxtjs.dev/config-head // Global page headers: https://go.nuxtjs.dev/config-head
head: { head: {
title: 'rc-busness', title: '皇家官方商城',
htmlAttrs: { htmlAttrs: {
lang: 'en', lang: 'zh-cn',
}, },
script: [ script: [
//{ src: '/js/rem.js' }, //{ src: '/js/rem.js' },

View File

@ -1,10 +1,7 @@
<template> <template>
<div> <div>
<Myheader></Myheader> <Myheader></Myheader>
<div class="rc-top"></div> <div class="rc-top"></div>
<unlogin></unlogin>
<!-- Suppose in header end --> <!-- Suppose in header end -->
<div class="ts-banner-swiper-container"> <div class="ts-banner-swiper-container">
<swiper :options="headerSwiperOption"> <swiper :options="headerSwiperOption">
@ -40,15 +37,16 @@
<div class="online bold rc-md-up" v-show="catproduct"></div> <div class="online bold rc-md-up" v-show="catproduct"></div>
<div class="rc-full-width"> <div class="rc-full-width">
<div class="rc-lunbo rc-full-width"> <div class="rc-lunbo rc-full-width ts-position-identifier" data-rel="明星猫粮">
<!-- <h2>明星猫粮</h2> --> <!-- <h2>明星猫粮</h2> -->
<div class="pageFullScreen" id="xxxFullScreen" v-show="catproduct" ref="mingxing"> <div class="pageFullScreen" id="xxxFullScreen" v-show="catproduct" ref="mingxing">
<!-- 内容 --> <!-- 内容 -->
<div class="swiper-container rc-full-width rc-padding-y--md" id="swiper1"> <div class="rc-full-width rc-padding-y--md" id="swiper1">
<h2 class="rc-beta rc-text--center">{{usertitle}}</h2> <h2 class="rc-beta rc-text--center">{{usertitle}}</h2>
<!-- 轮播图 --> <!-- 轮播图 -->
<van-swipe class="rc-padding-bottom--md"> <div class="ts-carousel-container">
<van-swipe-item v-for="(item, index) in catlistvideo" :key="index"> <swiper class="rc-padding-bottom--md" :options="catStarProductswiperOption">
<swiper-slide v-for="(item, index) in catlistvideo" :key="index">
<div class="rc-video"> <div class="rc-video">
<div class="uservideo"> <div class="uservideo">
<video controls="" :poster=item.catimage> <video controls="" :poster=item.catimage>
@ -57,7 +55,7 @@
</div> </div>
<div class="rc-right"> <div class="rc-right">
<img :src=item.catimage alt=""> <img :src=item.productimage alt="">
<span>{{item.title}}</span> <span>{{item.title}}</span>
<p>{{item.detail}}</p> <p>{{item.detail}}</p>
<em>{{item.price}}</em> <em>{{item.price}}</em>
@ -72,7 +70,7 @@
</video> </video>
</div> </div>
<img :src=item.catimage alt=""> <img :src=item.productimage alt="">
<span>{{item.title}}</span> <span>{{item.title}}</span>
<p>{{item.detail}}</p> <p>{{item.detail}}</p>
<em>{{item.price}}</em> <em>{{item.price}}</em>
@ -81,23 +79,20 @@
<i @click="userbuy(item,index)" class="ts-standard-btn ts-standard-btn--two center">立即购买</i> <i @click="userbuy(item,index)" class="ts-standard-btn ts-standard-btn--two center">立即购买</i>
</div> </div>
</div> </div>
</van-swipe-item> </swiper-slide>
</van-swipe> </swiper>
<div id="catStarSwiperPagnation" class="swiper-pagination ts-carousel-indicator center"></div>
</div>
</div> </div>
</div> </div>
<div class="online bold" v-show="onemao"></div> <div class="online bold" v-show="onemao"></div>
<div class="selectionswitch rc-full-width rc-max-width--xl rc-padding-y--md" ref="usercontent" v-show="onemao"> <div class="selectionswitch rc-full-width rc-max-width--xl rc-padding-y--md" ref="usercontent" v-show="onemao">
<h2 class="rc-beta rc-text--center" >全价猫湿粮</h2> <h2 class="rc-beta rc-text--center ts-position-identifier" data-rel="猫湿粮" >全价猫湿粮</h2>
<van-tabs @change='catclick' class="van-tabs"> <van-tabs @click='catclickShi' class="van-tabs" v-if="onemao" v-model="maoshiCurIndex">
<van-tab v-for="(item,index) in discoun" :key="index" :title="item.title"> <van-tab v-for="(item,index) in discoun" :key="index" :title="item.title">
<div class="rc-contair"> <div class="rc-contair">
<ul class="ts-product-list rc-margin-bottom--lg"> <ul class="ts-product-list rc-margin-bottom--lg">
@ -170,22 +165,18 @@
</div> </div>
</li> </li>
</ul> </ul>
<nuxt-link :to="`/productdetails/productlist/`">
<nuxt-link :to="`/productdetails/productlist/`"> <div class="userserlect">
<div class="userserlect"> <span class="ts-standard-btn center">查看更多</span>
<span class="ts-standard-btn center">查看更多</span> </div>
</div> </nuxt-link>
</nuxt-link>
</div> </div>
</div>
</div>
</div> </div>
<div class="online bold" v-show="twomao"></div> <div class="online bold" v-show="twomao"></div>
<div class="selectionswitch rc-full-width rc-max-width--xl rc-padding-y--md" v-show="twomao" ref="catgan"> <div class="selectionswitch rc-full-width rc-max-width--xl rc-padding-y--md" v-show="twomao" ref="catgan">
<h2 class="rc-beta rc-text--center">全价猫干粮</h2> <h2 class="rc-beta rc-text--center ts-position-identifier" data-rel="猫干粮">全价猫干粮</h2>
<van-tabs @change='catclick' class="van-tabs"> <van-tabs @click='catclickGan' class="van-tabs" v-if="twomao" v-model="maoganCurIndex">
<van-tab v-for="(item,index) in discoun" :key="index" :title="item.title"> <van-tab v-for="(item,index) in discoun" :key="index" :title="item.title">
<div class="rc-contair"> <div class="rc-contair">
<ul class="ts-product-list rc-margin-bottom--lg"> <ul class="ts-product-list rc-margin-bottom--lg">
@ -260,7 +251,7 @@
<strong class="ts-standard-btn ts-standard-btn--two rc-margin-y--md center" @click="selectproduce(item,index)">立即购买</strong> <strong class="ts-standard-btn ts-standard-btn--two rc-margin-y--md center" @click="selectproduce(item,index)">立即购买</strong>
</div> </div>
</li> </li>
</ul> </ul>
<nuxt-link :to="`/productdetails/productlist/`"> <nuxt-link :to="`/productdetails/productlist/`">
<div class="userserlect"> <div class="userserlect">
<span class="ts-standard-btn center">查看更多</span> <span class="ts-standard-btn center">查看更多</span>
@ -280,11 +271,12 @@
<!-- 内容 --> <!-- 内容 -->
<div class="swiper-container rc-full-width rc-padding-y--md" id="swiper2"> <div class="swiper-container rc-full-width rc-padding-y--md" id="swiper2">
<div class="oc-top"> <div class="oc-top">
<h2 class="rc-beta rc-text--center">{{dogtitle}}</h2> <h2 class="rc-beta rc-text--center ts-position-identifier" data-rel="明星犬粮">{{dogtitle}}</h2>
</div> </div>
<!-- 轮播图 --> <!-- 轮播图 -->
<van-swipe class="rc-padding-bottom--md"> <div class="ts-carousel-container">
<van-swipe-item v-for="(item, key) in doglistvideo" :key="key"> <swiper class="rc-padding-bottom--md" :options="dogStarProductswiperOption" v-if="dogshow">
<swiper-slide v-for="(item, key) in doglistvideo" :key="key">
<div class="rc-video"> <div class="rc-video">
<div class="uservideo"> <div class="uservideo">
<video controls="" :poster=item.catimage> <video controls="" :poster=item.catimage>
@ -293,7 +285,7 @@
</div> </div>
<div class="rc-right"> <div class="rc-right">
<img :src=item.catimage alt=""> <img :src=item.productimage alt="">
<span>{{item.title}}</span> <span>{{item.title}}</span>
<p>{{item.detail}}</p> <p>{{item.detail}}</p>
<em>{{item.price}}</em> <em>{{item.price}}</em>
@ -308,7 +300,7 @@
</video> </video>
</div> </div>
<img :src=item.catimage alt=""> <img :src=item.productimage alt="">
<span>{{item.title}}</span> <span>{{item.title}}</span>
<p>{{item.detail}}</p> <p>{{item.detail}}</p>
<em>{{item.price}}</em> <em>{{item.price}}</em>
@ -318,8 +310,10 @@
</div> </div>
</div> </div>
</van-swipe-item> </swiper-slide>
</van-swipe> </swiper>
<div id="dogStarSwiperPagnation" class="swiper-pagination ts-carousel-indicator center"></div>
</div>
</div> </div>
@ -330,21 +324,20 @@
<div class="selectionswitch rc-full-width rc-max-width--xl rc-padding-y--md" v-show="threemao" ref="doggshi"> <div class="selectionswitch rc-full-width rc-max-width--xl rc-padding-y--md" v-show="threemao" ref="doggshi">
<h2 class="rc-beta rc-text--center">全价犬湿粮</h2> <h2 class="rc-beta rc-text--center ts-position-identifier" data-rel="犬湿粮">全价犬湿粮</h2>
<van-tabs @change='userdog' class="van-tabs"> <van-tabs @click='userdogShi' class="van-tabs" v-if="threemao" v-model="quanshiCurIndex">
<div class="online bold rc-md-down" v-show="threemao"></div>
<van-tab v-for="(item,index) in dogtype" :key="index" :title="item.title"> <van-tab v-for="(item,index) in dogtype" :key="index" :title="item.title">
<div class="online bold" v-show="threemao"></div> <div class="online bold rc-md-up" v-show="threemao"></div>
<div class="usermain"> <div class="usermain">
<ul class="ul-dog usermain"> <ul class="ul-dog usermain">
<li <li
v-for="(item, index) in userdoglist" v-for="(dogListitem, dogListIndex) in userdoglist"
:key="index" :key="dogListIndex"
@click="quanshi(item, index)" @click="quanshi(dogListitem, dogListIndex)"
:class="activeIndex5 == index ? 'active' : 'unactive'" :class="activeIndex5 == dogListIndex ? 'active' : 'unactive'"
> >
<img :src="item.catimage" alt=""> <img :src="dogListitem.catimage" alt="">
<span>{{ item.title }}</span> <span>{{ dogListitem.title }}</span>
</li> </li>
</ul> </ul>
</div> </div>
@ -427,12 +420,11 @@
</li> </li>
</ul> </ul>
<nuxt-link :to="`/productdetails/productlist/`">
<nuxt-link :to="`/productdetails/productlist/`"> <div class="userserlect">
<div class="userserlect"> <span class="ts-standard-btn center">查看更多</span>
<span class="ts-standard-btn center">查看更多</span> </div>
</div> </nuxt-link>
</nuxt-link>
</div> </div>
@ -447,20 +439,20 @@
<div class="online bold" v-show="fourmao"></div> <div class="online bold" v-show="fourmao"></div>
<div class="selectionswitch rc-full-width rc-max-width--xl rc-padding-y--md" v-show="fourmao" ref="dogan"> <div class="selectionswitch rc-full-width rc-max-width--xl rc-padding-y--md" v-show="fourmao" ref="dogan">
<h2 class="rc-beta rc-text--center">全价犬干粮</h2> <h2 class="rc-beta rc-text--center ts-position-identifier" data-rel="犬干粮">全价犬干粮</h2>
<van-tabs @change='userdog' class="van-tabs"> <van-tabs @click='userdogGan' class="van-tabs" v-if="fourmao" v-model="quanganCurIndex">
<div class="online bold" v-show="fourmao"></div> <div class="online bold rc-md-up" v-show="fourmao"></div>
<van-tab v-for="(item,index) in dogtype" :key="index" :title="item.title"> <van-tab v-for="(item,index) in dogtype" :key="index" :title="item.title">
<div class="usermain"> <div class="usermain">
<ul class="ul-dog usermain"> <ul class="ul-dog usermain">
<li <li
v-for="(item, index) in userdoglist" v-for="(userDogListItem, userDogListIndex) in userdoglist"
:key="index" :key="userDogListIndex"
@click="userdoghot(item, index)" @click="userdoghot(userDogListItem, userDogListIndex)"
:class="activeIndex6 == index ? 'active' : 'unactive'" :class="activeIndex6 == userDogListIndex ? 'active' : 'unactive'"
> >
<img :src="item.catimage" alt=""> <img :src="userDogListItem.catimage" alt="">
<span>{{ item.title }}</span> <span>{{ userDogListItem.title }}</span>
</li> </li>
</ul> </ul>
</div> </div>
@ -540,12 +532,11 @@
</div> </div>
</li> </li>
</ul> </ul>
<nuxt-link :to="`/productdetails/productlist/`">
<nuxt-link :to="`/productdetails/productlist/`"> <div class="userserlect">
<div class="userserlect"> <span class="ts-standard-btn center">查看更多</span>
<span class="ts-standard-btn center">查看更多</span> </div>
</div> </nuxt-link>
</nuxt-link>
</div> </div>
@ -558,8 +549,8 @@
<div class="online bold" v-show="fivemao"></div> <div class="online bold" v-show="fivemao"></div>
<div class="selectionswitch rc-full-width rc-max-width--xl rc-padding-y--md" v-show="fivemao" ref="chufang"> <div class="selectionswitch rc-full-width rc-max-width--xl rc-padding-y--md" v-show="fivemao" ref="chufang">
<h2 class="rc-beta rc-text--center">处方用粮</h2> <h2 class="rc-beta rc-text--center ts-position-identifier" data-rel="处方用粮">处方用粮</h2>
<van-tabs @change='userclick' class="van-tabs"> <van-tabs @click='userclick' class="van-tabs" v-if="fivemao">
<van-tab v-for="(item,index) in discounchufang" :key="index" :title="item.title"> <van-tab v-for="(item,index) in discounchufang" :key="index" :title="item.title">
<div class="rc-contair"> <div class="rc-contair">
<ul class="ts-product-list rc-margin-bottom--lg"> <ul class="ts-product-list rc-margin-bottom--lg">
@ -703,7 +694,11 @@
<span>回到顶部</span> <span>回到顶部</span>
</div> </div>
</div> </div>
<div v-if="!dataLoaded" class="ts-mask">
<div class="ts-mask-bg"></div>
<div class="userloding"></div>
<span>数据加载中</span>
</div>
<Myfooter v-on:litentop='showmesg'></Myfooter> <Myfooter v-on:litentop='showmesg'></Myfooter>
</div> </div>
</template> </template>
@ -720,9 +715,11 @@
meta: {title: '首页'}, meta: {title: '首页'},
data(){ data(){
return{ return{
fixedHeader:false,
dataLoaded:true,
useraindex:0, useraindex:0,
usertitle:'明星猫粮', usertitle:'明星猫粮',
dogtitle:'明星粮', dogtitle:'明星粮',
processinformation:[], processinformation:[],
catshi:[], catshi:[],
userindex:0, userindex:0,
@ -800,10 +797,16 @@
], ],
'pc':[ 'pc':[
{src:"/images/banner/pc-banner1.png",link:""}, {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:[], showingBanners:[],
maoganCurIndex:0,
maoshiCurIndex:0,
quanshiCurIndex:0,
quanganCurIndex:0,
userdoglist: [ userdoglist: [
{ {
title: "小型犬", title: "小型犬",
@ -840,10 +843,10 @@
discountlist: [ discountlist: [
{ {
title: "明星猫粮", title: "明星猫粮",
detail:'为10月龄及以上英国短毛猫成猫量身打造的精准营养', detail:'为10月龄及以上英国短毛猫成猫量身打造的精准营养',
catimage: require("../assets/star-cat.png"), catimage: require("../assets/star-cat.png"),
price:'¥2' price:'¥2'
}, },
{ {
title: "猫湿粮", title: "猫湿粮",
@ -859,7 +862,7 @@
catimage: require("../assets/cat.png"), catimage: require("../assets/cat.png"),
}, },
{ {
title: "明星粮", title: "明星粮",
detail:'为10月龄及以上英国短毛猫成猫量身打造的精准营养', detail:'为10月龄及以上英国短毛猫成猫量身打造的精准营养',
price:'¥112', price:'¥112',
catimage: require("../assets/six.png"), catimage: require("../assets/six.png"),
@ -917,64 +920,72 @@
], ],
catlistvideo: [ catlistvideo: [
{ {
title: "明星猫粮", title: "主食级猫湿粮",
video:"/images/cat/one.mp4", video:"/images/cat/one.mp4",
catimage: "/images/cat/one.jpg", catimage: "/images/cat/one.jpg",
detail:'为10月龄及以上英国短毛猫成猫量身打造的精准营养', productimage: "/images/cat/star-1.png",
price:'¥123.45', detail:'为10柔软细腻慕斯 适合离乳期幼猫舔食',
price:'¥77',
}, },
{ {
title: "猫湿粮", title: "幼猫成长专属",
video:"/images/cat/two.mp4", video:"/images/cat/two.mp4",
catimage: "/images/cat/two.jpg", catimage: "/images/cat/two.jpg",
detail:'为10月龄及以上英国短毛猫成猫量身打造的精准营养', productimage: "/images/cat/star-2.png",
price:'¥123.45', detail:'支持幼猫自身保护力 为快速生长提供足够能量',
price:'¥147',
}, },
{ {
title: "猫干粮", title: "室内成猫专属",
video:"/images/cat/three.mp4", video:"/images/cat/three.mp4",
catimage: "/images/cat/three.jpg", catimage: "/images/cat/three.jpg",
detail:'为10月龄及以上英国短毛猫成猫量身打造的精准营养', productimage: "/images/cat/star-3.png",
price:'¥123.45', detail:'高易消化蛋白 减少粪便量和异味',
price:'¥140',
}, },
{ {
title: "猫干粮", title: "英短成猫专属",
video:"/images/cat/four.mp4", video:"/images/cat/four.mp4",
catimage: "/images/cat/four.jpg", catimage: "/images/cat/four.jpg",
detail:'为10月龄及以上英国短毛猫成猫量身打造的精准营养', productimage: "/images/cat/star-4.png",
price:'¥123.45', detail:'增强肌肉质量 支持骨骼与关节健康',
price:'¥183',
}, },
], ],
doglistvideo: [ doglistvideo: [
{ {
title: "明星狗粮", title: "主食级狗湿粮",
video:"/images/dog/one.mp4", video:"/images/dog/one.mp4",
catimage: "/images/dog/one.jpg", catimage: "/images/dog/one.jpg",
detail:'为10月龄及以上成犬量身打造的精准营养', productimage: "/images/cat/star-1.png",
price:'¥123.45', detail:'柔软细腻慕斯 适合离乳期幼犬舔食',
price:'¥77',
}, },
{ {
title: "狗湿粮", title: "贵宾成犬专属",
video:"/images/dog/two.mp4", video:"/images/dog/two.mp4",
catimage: "/images/dog/two.jpg", catimage: "/images/dog/two.jpg",
detail:'为10月龄及以上英国成犬量身打造的精准营养', productimage: "/images/cat/star-2.png",
price:'¥123.45', detail:'护肤靓毛 理想体态',
price:'¥241',
}, },
{ {
title: "狗干粮", title: "小型犬成犬专属",
video:"/images/dog/three.mp4", video:"/images/dog/three.mp4",
catimage: "/images/dog/three.jpg", catimage: "/images/dog/three.jpg",
detail:'为10月龄及以上英国犬成犬量身打造的精准营养', productimage: "/images/cat/star-3.png",
price:'¥123.45', detail:'亮泽被毛 呵护牙齿',
price:'¥121',
}, },
{ {
title: "狗干粮", title: "离乳期全价奶糕",
video:"/images/dog/four.mp4", video:"/images/dog/four.mp4",
catimage: "/images/dog/four.jpg", catimage: "/images/dog/four.jpg",
detail:'为10月龄及以上英国成犬量身打造的精准营养', productimage: "/images/cat/star-4.png",
price:'¥123.45', detail:'高易再水合颗粒 帮助增强保护健康成长',
price:'¥88',
}, },
], ],
@ -1056,7 +1067,8 @@
spaceBetween: 0, spaceBetween: 0,
autoplay: true, autoplay: true,
pagination: { pagination: {
el: '#homeBannerSwiperPagnation' el: '#homeBannerSwiperPagnation',
clickable:true
}, },
paginationClickable: true, paginationClickable: true,
loopAdditionalSlides: 100, loopAdditionalSlides: 100,
@ -1083,6 +1095,7 @@
loopAdditionalSlides: 100, loopAdditionalSlides: 100,
pagination: { pagination: {
el: '#catStarSwiperPagnation', el: '#catStarSwiperPagnation',
clickable:true
}, },
navigation: { navigation: {
nextEl: '.swiper-button-next', nextEl: '.swiper-button-next',
@ -1106,6 +1119,7 @@
loopAdditionalSlides: 100, loopAdditionalSlides: 100,
pagination: { pagination: {
el: '#dogStarSwiperPagnation', el: '#dogStarSwiperPagnation',
clickable:true
}, },
navigation: { navigation: {
nextEl: '.swiper-button-next', nextEl: '.swiper-button-next',
@ -1139,8 +1153,14 @@
} }
window.addEventListener("scroll", this.handleScroll, true); window.addEventListener("scroll", this.handleScroll, true);
this.userchufang();// this.userchufang();//
this.catmessage();// this.catmessage();//
this.catclickGan();
this.catclickShi();
this.dogmessage();// this.dogmessage();//
this.userdogShi();
this.userdogGan();
}, },
destroyed () { destroyed () {
window.removeEventListener('scroll', this.scrollToTop); window.removeEventListener('scroll', this.scrollToTop);
@ -1192,8 +1212,6 @@
ifadroind(item,index,order){ ifadroind(item,index,order){
//console.log(item,index,order); //console.log(item,index,order);
var sUserAgent = navigator.userAgent.toLowerCase(); var sUserAgent = navigator.userAgent.toLowerCase();
var bIsIpad = sUserAgent.match(/ipad/i) == "ipad"; var bIsIpad = sUserAgent.match(/ipad/i) == "ipad";
var bIsIphoneOs = sUserAgent.match(/iphone os/i) == "iphone os"; var bIsIphoneOs = sUserAgent.match(/iphone os/i) == "iphone os";
@ -1204,8 +1222,8 @@
var bIsCE = sUserAgent.match(/windows ce/i) == "windows ce"; var bIsCE = sUserAgent.match(/windows ce/i) == "windows ce";
var bIsWM = sUserAgent.match(/windows mobile/i) == "windows mobile"; var bIsWM = sUserAgent.match(/windows mobile/i) == "windows mobile";
if (!(bIsIpad || bIsIphoneOs || bIsMidp || bIsUc7 || bIsUc || bIsAndroid || bIsCE || bIsWM)) { if (!(bIsIpad || bIsIphoneOs || bIsMidp || bIsUc7 || bIsUc || bIsAndroid || bIsCE || bIsWM)) {
//console.log("") //console.log("")
if(item.title=='明星猫粮'){ if(item.title=='明星猫粮'){
this.catproduct=true; this.catproduct=true;
this.twomao=false; this.twomao=false;
@ -1268,7 +1286,7 @@
this.dogshow=false; this.dogshow=false;
this.catproduct=false; this.catproduct=false;
} }
if(item.title=='明星粮'){ if(item.title=='明星粮'){
this.onemao=false; this.onemao=false;
this.twomao=false; this.twomao=false;
this.threemao=false; this.threemao=false;
@ -1290,19 +1308,43 @@
let dogtop=document.querySelector('.oc-top'); let dogtop=document.querySelector('.oc-top');
//console.log(dogtop); //console.log(dogtop);
//console.log(mingxin.offsetTop); //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=='处方用粮'){ if(item.title=='犬湿粮'||item.title=='犬干粮'||item.title=='处方用粮'){
userindex=userindex-2 userindex=userindex-2
}else{ }else{
userindex=userindex-1 userindex=userindex-1
} }
if(item.title=='明星猫粮'){ if(item.title=='明星猫粮'){
mingxin.scrollIntoView(true); mingxin.scrollIntoView(true);
}else{ }else{
let catshiid=document.querySelectorAll('.selectionswitch'); let catshiid=document.querySelectorAll('.selectionswitch');
catshiid[userindex].scrollIntoView(true); catshiid[userindex].scrollIntoView(true);
} }
if(item.title=='明星狗粮') if(item.title=='明星粮')
dogtop.scrollIntoView(true); dogtop.scrollIntoView(true);
// if(item.title=="湿"){ // if(item.title=="湿"){
// this.catproduct=false; // this.catproduct=false;
// this.catfood=true; // this.catfood=true;
@ -1312,6 +1354,7 @@
// } // }
//console.log("") //console.log("")
*/
} }
}, },
heightToTop(ele){ heightToTop(ele){
@ -1358,70 +1401,70 @@
this.userserachlist.push(petType) this.userserachlist.push(petType)
} }
} }
this.dogmessage(this.userserachlist) //TODO how to combine "apiName" here?
}, this.dogmessage(this.userserachlist,"Gan");
},
userlook(order){
userlook(order){ if(order==0){
if(order==0){ this.catshi=this.catlist;
this.catshi=this.catlist; }
} if(order==1){
if(order==1){ this.catgan=this.catlist;
this.catgan=this.catlist; }else if(order==2){
this.dogshi=this.doglist
}else if(order==2){ }
this.dogshi=this.doglist else if(order==3){
} this.doggan=this.doglist
else if(order==3){ }
this.doggan=this.doglist else if(order==4){
} this.processinformation=this.chufanlist
else if(order==4){ }
this.processinformation=this.chufanlist },
} showmesg(){
this.toTop();
}, },
handleScroll(e)
showmesg(){
this.toTop();
},
handleScroll(e)
{
let fixedCatbarSeperator = document.getElementById("fixed-catbar-seperator");
if(!fixedCatbarSeperator)
{ {
return; let fixedCatbarSeperator = document.getElementById("fixed-catbar-seperator");
} if(!fixedCatbarSeperator)
let scrolltop = document.documentElement.scrollTop || document.body.scrollTop; {
if((scrolltop-fixedCatbarSeperator.offsetTop)>0) return;
{ }
this.gotop = true let scrolltop = document.documentElement.scrollTop || document.body.scrollTop;
this.searchBar=false if((scrolltop-fixedCatbarSeperator.offsetTop)>0)
} {
else this.fixedHeader=false;
{ this.gotop = true
this.gotop = false; this.searchBar=false
this.searchBar=true }
} else
}, {
toTop() { this.fixedHeader=true;
let top = document.documentElement.scrollTop || document.body.scrollTop; this.gotop = false;
// this.searchBar=true
const timeTop = setInterval(() => { }
document.body.scrollTop = document.documentElement.scrollTop = top -= 400; },
if (top <= 0) { toTop() {
clearInterval(timeTop); let top = document.documentElement.scrollTop || document.body.scrollTop;
} //
}, 10); const timeTop = setInterval(() => {
}, document.body.scrollTop = document.documentElement.scrollTop = top -= 400;
async courseId(item) { if (top <= 0) {
let data = await postCourseId(this.productCode,1,this.usermessage.data.id,this.usermessage.data.mobile,item.picFile,item.name,item.basePrice,item.specifications); clearInterval(timeTop);
if(data){ }
this.productlist=data; }, 10);
} },
}, async courseId(item) {
// this.dataLoaded=false;
async catmessage(stype) { 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=[]; let data=[];
if(stype==undefined||stype==null){ if(stype==undefined||stype==null){
data = await biaomessage(0,'',1,6); data = await biaomessage(0,'',1,6);
@ -1429,11 +1472,22 @@
data = await biaomessage(this.userserachlist,'',1,6); data = await biaomessage(this.userserachlist,'',1,6);
} }
if(data){ if(data){
this.catlist=data;
let userlist=[]; let userlist=[];
userlist=data.slice(0,6); //userlist=data.slice(0,6);
this.catshi=userlist; if(dataType)
this.catgan=userlist; {
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 +1520,7 @@
} }
}, },
selectproduce(item,index){ selectproduce(item,index){
if(item.productList[0]==undefined){ if(item.productList[0]==undefined){
item.productlist[0].productCode=0; item.productlist[0].productCode=0;
} }
@ -1480,29 +1534,29 @@
productCode:item.productList[0].productCode productCode:item.productList[0].productCode
}, },
}); });
}, },
// //
async userchufang() { async userchufang() {
let list=[]; this.dataLoaded=false;
let data = await userque(); let list=[];
if(data){ let data = await userque();
list=data.slice(0,6); if(data){
this.processinformation=list; list=data.slice(0,6);
this.chufanlist=data; this.processinformation=list;
this.chufanlist=data;
} this.dataLoaded=true;
}
}, },
//
// async userquery(item) {
async userquery(item) { this.dataLoaded=false;
let data = await userquery(item); let data = await userquery(item);
if(data){ if(data){
this.processinformation=data; this.processinformation=data;
} this.dataLoaded=true;
}
}, },
// //
userclick(item,index){ userclick(item,index){
this.userquery(index) this.userquery(index)
@ -1537,68 +1591,61 @@
this.userserachlist.push(petType) this.userserachlist.push(petType)
} }
} }
this.catmessage(this.userserachlist) this.catmessage(this.userserachlist,'Shi')
}, },
lianxi(item,index){ lianxi(item,index){
if(item.title=='在线客服'){ if(item.title=='在线客服'){
var option = { var option = {
customer: {id: '', name: '', email: '', mobile: '', memberId: '999999'} customer: {id: '', name: '', email: '', mobile: '', memberId: '999999'}
} }
dis_livchat(option); dis_livchat(option);
} }
if(item.title=='购物车'){ if(item.title=='购物车'){
this.$router.push({ this.$router.push({
path: "/myorder/userrecord", 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);
if(item.title=='营养专家'){ this.activeIndex=index;
var option = { //console.log(item.title);
customer: {id: '', name: '', email: '', mobile: '', memberId: '999999'} this.ifadroind(item,index,this.useraindex)
} // this.ifAdoid(item,index);
dis_livchat(option); },
} quanshi(item,index){
this.activeIndex5=index;
}, this.userdogShi();
userbuy(item){ },
let user= localStorage.getItem("userInfo"); userdoghot(item,index){
this.courseId(item) this.activeIndex6=index;
this.$router.push({ this.userdogGan();
path: "/myorder/userrecord", },
selectGo(item,index){
}); this.activeInde2=index;
}, },
selectGoo(item,index){
selectGoods(item,index){ this.activeInde3=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;
}
},
} }

View File

@ -1,12 +1,8 @@
<template> <template>
<div> <div>
<Myheader></Myheader> <Myheader></Myheader>
<div class="rc-top"></div> <div class="usermain">
<div class="online bold"></div> <div class="rc-main" v-for="(item, index) in list" :key="index">
<div class="usercontshow rc-max-width--xl">
<div class="usercontend" v-for="(item, index) in list" :key="index">
<div class="usercontshow usermain" >
<div class="rc-cat" >
<div class="rc-center"> <div class="rc-center">
<div class=" rc-title"> <div class=" rc-title">
<em> <em>
@ -33,33 +29,16 @@
</div> </div>
</div> </div>
</div> </div>
</div>
</div>
<div class="online bold rc-md-down"></div>
<!-- <div class="usercontend useradd">
<img src="../../assets/image/userselect.png" alt="">
<span>添加收货地址</span>
</div> -->
</div>
<div class="usercontshow useredit">
<img src="../../assets/image/userselect.png" alt="">
<span>添加收货地址</span>
</div> </div>
</div>
<div class="rc-button"> <div class="rc-button">
<div class="rc-footbutton" @click="onAdd()"> <div class="rc-footbutton" @click="onAdd()">
<span>新增收货地址</span> <span>新增收货地址</span>
</div> </div>
</div> </div>
</div> </div>
<MyFooter></MyFooter>
</div>
</template> </template>
<script> <script>
@ -144,8 +123,7 @@ export default {
}, },
}, },
components: { components: {
Myheader, Myheader,
MyFooter
}, },
mounted() { mounted() {

View File

@ -64,7 +64,7 @@
</div> </div>
<div class="rc-layout-container rc-two-column rc-button"> <div class="rc-layout-container rc-two-column rc-button">
<div class="rc-column rc-text--left"> <div class="rc-column rc-text--left">
<a href="#" class="rc-styled-link"><span>隐私政策</span></a> <a href="https://royalcanin.com.cn/privacy" target="_blank" class="rc-styled-link"><span>隐私政策</span></a>
</div> </div>
<div class="rc-column rc-text--right"> <div class="rc-column rc-text--right">
<nuxt-link :to="`/userlogin/login/`" class="rc-styled-link"> <nuxt-link :to="`/userlogin/login/`" class="rc-styled-link">

View File

@ -84,7 +84,7 @@
</div> </div>
<div class="rc-layout-container rc-two-column rc-button"> <div class="rc-layout-container rc-two-column rc-button">
<div class="rc-column rc-text--left"> <div class="rc-column rc-text--left">
<a href="#" class="rc-styled-link"><span>隐私政策</span></a> <a href="https://royalcanin.com.cn/privacy" target="_blank" class="rc-styled-link"><span>隐私政策</span></a>
</div> </div>
<div class="rc-column rc-text--right"> <div class="rc-column rc-text--right">
<nuxt-link :to="`/userlogin/edit/`" class="rc-styled-link"> <nuxt-link :to="`/userlogin/edit/`" class="rc-styled-link">