!21 2022-1-17 Leung

Merge pull request !21 from Admin/sit-Leung

rc-busness/ajax/getData.js

@@ -201,10 +201,13 @@ export const userque = (stype) => {
 
 
 //标品全部信息
-export const biaomessage = (stype,name) => {
-  console.log(stype);
+export const biaomessage = (stype,name,curPage,curRow) => {
+	if(!curPage)
+		curPage=1;
+	if(!curRow)
+		curRow=10;
+	let queryTail='&page='+curPage+'&rows='+curRow;
 	if(stype.length>1){
-    console.log("========");
 		let list={};
 		stype.map(item=>{
 			console.log(item);
@@ -215,18 +218,10 @@ export const biaomessage = (stype,name) => {
 			str = str + key + "=" + list[key] + "&";
 		}
 		stype = str.substr(0,str.length-1);
-    var data = {
-      page:1,
-      row:10
-    }
-    return fetch('product/query'+stype, data, 'POST' )
+		return fetch('product/query'+stype+queryTail, '', 'POST' )
 	}else{
-    console.log('-==');
-    return fetch('product/query?petType='+stype,data, 'POST' )
-    
+		return fetch('product/query?petType='+stype+queryTail, '', 'POST' )
 	}
- 
-   
 }
 
 export const searchchanpin = (stype) => {

rc-busness/assets/css/global.less

@@ -38,8 +38,7 @@ img, picture {
 	flex-wrap: wrap;
 	justify-content: space-evenly;
 	&:after{
-		content:"";
-		width:154px;
+
 	}
 	li{
 		border: 1px solid #D7D7D7;
@@ -369,17 +368,25 @@ img, picture {
 		display:block;
 		li{
 			max-width:20rem;
-			margin-right:.9rem;
-			margin-left:.9rem;
+			//margin-right:.875rem;
+			margin-left:2.2vw;
 			.rc-column{
 				span{
 					font-size:1.875rem;
 					height: 5.2rem;
 				}
 			}
+			&:nth-child(4n+1){
+				margin-left:0;
+			}
+			&:nth-child(4n){
+				//margin-right:0;
+			}
 		}
 		img{
 			width:20rem;
+			max-width:320px;
+			min-width:160px;
 		}
 	}
 	.ts-right-arr {
@@ -512,3 +519,14 @@ img, picture {
 		display: none!important;
 	}
 }
+@media screen and (min-width: 769px) and (max-width: 1370px)
+{
+	.ts-product-list {
+		display:flex;
+		justify-content: space-between;
+		li{
+			margin-left:0;
+			margin-right:0;
+		}
+	}
+}

rc-busness/assets/css/index.less

@@ -5,6 +5,36 @@
 /deep/.van-swipe__indicator--active{
 	background-color: #E1001A;
 }
+.rc-ma{
+	.ul-zhuan{
+		li{
+			background: unset;;
+			img{
+				border-radius: 50%;
+			}
+			&.active {
+				img{
+					border: 3px solid #E2001A;
+				}
+				color: #E2001A;
+			
+			}
+			&.unactive {
+				color: #444444;
+				img{
+					border: 3px solid #D7D7D7;
+				}
+			}
+		}
+	}
+}
+.uservideo{
+	overflow: hidden;
+	video{
+		height:100%;
+		width:auto;
+	}
+}
 @media screen and (max-width:768px){
 	.ul-dog{
 		display: none;
@@ -24,16 +54,14 @@
 			display: block;
 		}
 		img{
-			width: 0.64rem;
-			height: 0.64rem;
+			width: 4rem;
+			height: 4rem;
 			display: block;
 		}
 		li{
 			display: inline-block;
 			margin-left: 0.20rem;
-			width: 0.64rem;
 			text-align: center;
-			height: 0.64rem;
 			background: #F6F6F6;
 			border-radius: 50%;
 			opacity: 1;
@@ -260,12 +288,7 @@
 				li{
 					display: inline-block;
 					margin-left: 1.25rem;
-					width: 4rem;
 					text-align: center;
-					height: 4rem;
-					background: #F6F6F6;
-					border-radius: 50%;
-					opacity: 1;
 				}
 			}
 
@@ -281,14 +304,15 @@
 	}
 	.active {
 		font-size: 0.14rem;
-	border: 1px solid red;
-	color: red;
-
+		img{
+			border-width: 1px;
+		}
 	}
 	.unactive {
 		font-size: 0.14rem;
-	color: #444444;
-	border: 1px solid #D7D7D7;
+		img{
+			border-width: 1px;
+		}
 	}
 	// .usermain{
 	// 	display: none;
@@ -415,8 +439,6 @@ object-fit: cover;
 		width: 35rem;
 		height: 31.6rem;
 		display: block;
-border: 1px solid red;
-
 	}
 	.userleft{
 		position: absolute;
@@ -494,23 +516,19 @@ img{
 			flex-wrap: wrap;
 			flex-direction: row;
 			span{
-				margin-top: 2.5rem;
+				margin-top: 1vw;
 				display: block;
 			}
 			img{
-				width: 9.5rem;
-				height: 9.5rem;
+				width: 10vw;
+				height: 10vw;
 				display: block;
 			}
 			li{
 				cursor: pointer;
 				font-size: 16px;
-				width: 9.875rem;
 				text-align: center;
-				height: 9.875rem;
-				background: #F6F6F6;
-				border-radius: 50%;
-				margin-left:1.25rem;
+				margin-left:1.3vw;
 			}
 		}
 
@@ -525,8 +543,6 @@ img{
 	
 }
 .usermain{
-   margin-top: 2.5rem;
-   padding-bottom: 2.82rem;
 		.ul-dog{
 			width: 100%;
 			display: flex;
@@ -595,14 +611,15 @@ margin-left: 2.5rem;
 }
 	.active {
 		font-size: 1rem;
-   border: 3px solid red;
-   color: red;
-
+		img{
+			border-width: 3px;
+		}
 	}
 	.unactive {
 		font-size: 1rem;
-  color: #444444;
-   border: 1px solid #D7D7D7;
+		img{
+			border-width: 1px;
+		}
 	}
 .rc-maa{
     ul{
@@ -637,13 +654,10 @@ border-radius: 50%;
 
 	.userselection {
 		font-size: 0.16rem;
-
 		color: #E2001A;
-
 	}
 .unselection {
   font-size: 0.16rem;
- 
 }
 .rc-usermessage{
 	span{
@@ -653,3 +667,14 @@ color: #E2001A;
 	}
   }
 }
+
+@media screen and (min-width:600px) and (max-width:768px)
+{
+	.ul-zhuan{
+	    display: flex;
+	    justify-content: space-evenly;
+		li{
+			margin-left:0;
+		}
+	}
+}

rc-busness/components/header.vue

@@ -379,21 +379,23 @@
 	</div>
 </template>
 <script>
-
-
+const isReload={
+	needload:false
+};
 export default {
   data() {
     return {
 		headerScroll:false,
 		loginornot:true,//用户是否登录提示点
 		usermessage:null,//存储用户信息
-
     };
   },
+  created(){
+  },
   mounted() {
 	  //判断用户有无登录显示红点
 	let usernot=JSON.parse(localStorage.getItem("userInfo"));
-	console.log(usernot);
+	//console.log(usernot);
 	if(usernot==null ||usernot==undefined){
 		console.log(usernot);
           this.loginornot=true
@@ -401,21 +403,53 @@ export default {
 		 this.loginornot=false
 		this.usermessage=usernot;
 	}
-	console.log(this.loginornot);
+	//debugger;
+	if(isReload.needload)
+		location.reload();
+	if(isReload.needload==false)
+		isReload.needload=true;
+	//console.log(this.loginornot);
+	/*
+	if(RCDL && RCDL.utilities && RCDL.navigation && RCDL.navigation.rebuild)
+	{
+		
+		if (["sm", "xs", "md-1"].includes(RCDL.utilities.breakpoints.values.width.current)) {
+			this.refreshMobileNav();
+		}
+		else
+		{
+			this.refreshDesktopNav();
+		}
+		
+	}
+	*/
   },
 
   methods: {
-	  
+	refreshDesktopNav:function(){
+		RCDL.navigation.currentState=null;
+		RCDL.navigation.rebuild();
+	},
+	refreshMobileNav:function(){
+		let itemGroupList=document.querySelectorAll("nav[data-toggle-group=mobile] .rc-list--align[role=menu]");
+		itemGroupList.forEach(function(ele,i){
+			if(ele.className.indexOf("rc-expand--horizontal")<0 && ele.className.indexOf("rc-btn-offset--top")<0)
+			{
+				if(ele.id.indexOf("nav-list")>=0)
+					ele.classList.add("rc-expand--horizontal");
+				else if(ele.id.indexOf("nav-footer")>=0)
+					ele.classList.add("rc-expand--vertical");
+			}
+		})
+	},
 	bindTracking: function(){
-		console.log('bindTracking');
+		//console.log('bindTracking');
 	},
 
 	//
 	//跳转搜索
 	searchturn(){
-     this.$router.push({ name: "usersearch-search",
-					
-					})
+		this.$router.push({ name: "usersearch-search",})
 	},
      //判断有无登录跳转不同页面
 	turnlogin(){

rc-busness/components/magnifier.vue

@@ -1,288 +0,0 @@
-<template>
-  <div class="magnify">
-    <div class="left_contaner">
-      <div class="middle_img" @mouseover="boxMouseOver" @mouseleave="boxMouseLeave">
-        <img :src="middleImg" alt="" style="width:100%">
-        <div class="shade" @mouseover="shadeMouseOver" @mousemove="shadeMouseMove" ref="shade" v-show="isShade"></div>
-      </div>
-      <div class="carousel">
-        <div class="left_arrow arrow" @click="leftArrowClick">
-            <img src="../assets/image/userleft.jpg" alt="">
-        </div>
-
-        <div class="show_box">
-          <ul class="picture_container" ref="middlePicture">
-            <li class="picture_item" @click="tabPicture(item,index)" v-for="(item, index) in pictureList" :key="index">
-              <img :src="item.attachmentPath" class="small_img" alt="">
-            </li>
-          </ul>
-        </div>
-        <div class="right_arrow arrow" @click="rightArrowClick">
-			<img src="../assets/image/userright.png" alt="">
-        </div>
-      </div>
-    </div>
-    <div class="right_contanier" v-show="isBig">
-      <img :src="middleImg" ref="bigImg" class="big_img" alt="">
-    </div>
-  </div>
-</template>
-
-<script>
-import $ from 'jquery'
-export default {
-  props:['parentmsg'],
-  props: {
-
-    tableLabelTest:Array,
-    imgList: Array, // 图片数据
-    zoom: {
-      default: 2, // 缩略比例,放大比例
-      type: Number
-    }
-  },
-  data() {
-    return {
-	  middleImgWidth:350,
-	  middleImgHeight:350,
-	  thumbnailHeight:100,
-	  
-      tableLabelTest1:this.tableLabelTest,
-      pictureList: [
-		{url: require("../assets/four.png")},
-		{url: require("../assets/cat.png")},
-		{url: require("../assets/one.png")},
-		{url: require("../assets/six.png")},
-		{url: require("../assets/six.png")},
-		{url: require("../assets/six.png")},
-		{url: require("../assets/four.png")},
-		{url: require("../assets/cat.png")},
-		{url: require("../assets/one.png")},
-		{url: require("../assets/six.png")},
-		{url: require("../assets/six.png")},
-		{url: require("../assets/six.png")},
-      ],
-      menu:[],
-      middleImg: '', // 中图图片地址
-      bigImg: '', // 大图图片地址
-      isShade: false, // 控制阴影显示与否
-      isBig: false, // 控制放大图显示与否
-      initX: 0, // 初始clientX值
-      initY: 0, // 初始clientY值
-      leftX: 0, // 初始定位left
-      topY: 0, // 初始定位top
-      middleLeft: 0, // 当前放置小图盒子的定位left值,
-      itemWidth: 80, // 缩略图每张的宽度
-    }
-  },
-	watch:{
-		data:'ifadroind',// 值可以为methods的方法名
-		inputName: function(newValue) {
-			this.pictureList=newValue;
-			this.menu=newValue;
-			console.log(this.newValue);
-		}
-	},
-  created() {
-    
-  },
-
-  mounted() {
-	  let user= JSON.parse(localStorage.getItem("message"));
-	   console.log(user);
-	  if(user!==null){
-	   this.pictureList=user;
-	  }
-	  if (user && user.length) {
-		this.pictureList = user
-	  }
-	  this.middleImg = this.pictureList[0].attachmentPath;
-	  console.log(this.middleImg);
-	  // 计算缩略图的宽度,默认是显示4张图片,两边箭头的宽度和为50
-	  // this.itemWidth = (this.middleImgWidth-30) / 2
-	  this.ifadroind();
-	  this.$nextTick(() => {
-	  console.log(this.menu);
-      // 容器的高
-      const imgWidth = this.middleImgHeight + this.thumbnailHeight + 20
-      // 设置容器宽高
-      // $('.magnify').css({
-      //   width: this.middleImgWidth,
-      //   height: imgWidth
-      // })
-  
-      // 设置移动阴影图宽高
-      $('.middle_img .shade').css({
-        width: this.middleImgWidth/this.zoom,
-        height: this.middleImgHeight/this.zoom
-      })
-      // 设置缩略图容器高
-      $('.carousel').css({
-        height: this.thumbnailHeight
-      })
-      // 设置每个缩略图宽
-      // $('.picture_item').css({
-      //   width: this.itemWidth
-      // })
-      // 设置放大后图片容器的宽高,left
-      $('.right_contanier').css({
-        left: this.middleImgWidth,
-        width: imgWidth,
-        height: imgWidth
-      })
-      // 设置放大图片的宽高(图片的放大倍数)
-      $('.right_contanier .big_img').css({
-        width: imgWidth * this.zoom,
-        height: imgWidth * this.zoom
-      })
-    })
-  },
-  
-  methods: {
-            //判断是手机打开还是电脑打开
-    ifadroind(){
-		var sUserAgent = navigator.userAgent.toLowerCase();
-		var bIsIpad = sUserAgent.match(/ipad/i) == "ipad";
-		var bIsIphoneOs = sUserAgent.match(/iphone os/i) == "iphone os";
-		var bIsMidp = sUserAgent.match(/midp/i) == "midp";
-		var bIsUc7 = sUserAgent.match(/rv:1.2.3.4/i) == "rv:1.2.3.4";
-		var bIsUc = sUserAgent.match(/ucweb/i) == "ucweb";
-		var bIsAndroid = sUserAgent.match(/android/i) == "android";
-		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)) {
-		  //Mob Screen
-		}else{
-			//PC screen size
-			this.middleImgWidth=560;
-			this.middleImgHeight=560;
-		}
-		$('.middle_img').css({
-			width: this.middleImgWidth,
-			height: this.middleImgHeight
-		})
-  },
-    // 产品图片鼠标移入事件,显示阴影,显示大图
-    boxMouseOver (e) {
-      e.preventDefault();
-      e.stopPropagation();
-      this.isShade = true
-      this.isBig = true
-      // 计算阴影的位置
-      let x = e.offsetX - $('.shade').width()/2
-      let y = e.offsetY - $('.shade').height()/2
-      let maxLeft = $('.middle_img').width() - $('.shade').width() 
-      let maxTop = $('.middle_img').height() - $('.shade').height()
-      x = x <= 0 ? 0 : x
-      x = x >= maxLeft ? maxLeft : x
-      y = y <= 0 ? 0 : y
-      y = y >= maxTop ? maxTop : y
-      $('.shade').css({
-        left: x,
-        top: y
-      })
-    },
-    // 鼠标在阴影移动
-    shadeMouseMove (e) {
-
-      e.preventDefault();
-      e.stopPropagation();
-
-      //用页面x - 父盒子的offsetLeft - 父盒子的左边框宽度
-      var x = this.getEventPage(e).pageX - $('.middle_img')[0].offsetParent.offsetLeft - $('.middle_img')[0].offsetParent.clientLeft;
-      //用页面y - 父盒子的offsetTop - 父盒子的上边框宽度
-      var y = this.getEventPage(e).pageY - $('.middle_img')[0].offsetParent.offsetTop - $('.middle_img')[0].offsetParent.clientTop;
-
-      //让阴影的坐标居中
-      x -= $('.shade').width() / 2;
-      y -= $('.shade').height() / 2;
-
-      // 移动边界限制
-      let maxLeft = $('.middle_img').width() - $('.shade').width()
-      let maxTop = $('.middle_img').height() - $('.shade').height()
-      x = x <= 0 ? 0 : x
-      x = x >= maxLeft ? maxLeft : x
-      y = y <= 0 ? 0 : y
-      y = y >= maxTop ? maxTop : y
-      // 重新赋值当前的定位值
-      $('.shade').css({
-        left: x,
-        top: y
-      })
-      // 计算出实时的大图的定位,首先计算出比例
-      // 比例为x:大图宽度/小图宽度 y: 大图高度/小图高度,将小图的定位乘以比例就是大图的定位
-      const xRate = $('.big_img').width() / $('.middle_img').width()
-      const yRate = $('.big_img').height() / $('.middle_img').height()
-      $('.big_img').css({
-        left: -x*xRate,
-        top: -y*yRate
-      })
-      // console.log(e, x, y, xRate, yRate, 66677)
-    },
-    // 鼠标移入阴影,去除自定义事件
-    shadeMouseOver (e) {
-      e.preventDefault();
-      e.stopPropagation();
-      // console.log(88888, e)
-    },
-    // 图片移出隐藏阴影和大图
-    boxMouseLeave () {
-      this.isShade = false
-      this.isBig = false
-    },
-    // 切换图片
-    tabPicture (item,index) {
-      this.middleImg = item.attachmentPath
-      this.$emit('changeName',item)
-      console.log(item,index)
-    },
-    // 点击左边箭头
-    leftArrowClick () {
-      if (this.middleLeft < 0) {
-        // 每次向右平移一个图片盒子的宽度
-        this.middleLeft += this.itemWidth
-        $('.picture_container').animate({
-          left: this.middleLeft
-        }, 500)
-      }
-    },
-    // 点击右边箭头
-    rightArrowClick () {
-      // 每次向左平移一个盒子的宽度,最多移动的宽度为(图片数组长度-1)*每张缩略图的宽度
-      if (this.middleLeft > -this.itemWidth*(this.pictureList.length-1)) {
-		this.middleLeft -= this.itemWidth
-		$('.picture_container').animate({
-			left: this.middleLeft
-		}, 500)
-      }
-    },
-    /**
-     * 获取网页滚出去的距离（包括上面滚出去的部分和左边滚出去的部分）
-     * @returns {{scrollTop: (Number|number), scrollLeft: (Number|number)}}
-     */
-    getPageScroll() {
-      return {
-        scrollTop: window.pageYOffset || document.documentElement.scrollTop || document.body.scrollTop || 0,
-        scrollLeft: window.pageXOffset || document.documentElement.scrollLeft || document.body.scrollLeft || 0
-      }
-    },
-
-    /**
-    * 获取事件对象点击的点，相对于文档左上角的坐标
-    * @param e
-    * @returns {{pageX: *, pageY: *}}
-    */
-    getEventPage(e) {
-      return {
-        pageX: e.clientX + this.getPageScroll().scrollLeft,
-        pageY: e.clientY + this.getPageScroll().scrollTop
-      }
-    }
-  }
-}
-</script>
-
-<style lang="less" scoped>
-@import url("../assets/css/magnifier.less");
-</style>

rc-busness/pages/index.vue

@@ -3,30 +3,22 @@
 
 <div>
 	<Myheader></Myheader>
-
+	<div class="rc-top"></div>
     <unlogin></unlogin>
 	<!-- Suppose in header end -->
-	<van-swipe :autoplay="3000">
-		<van-swipe-item v-for="(banner, index) in banners" :key="index">
+	<van-swipe :autoplay="3000" class="rc-padding-bottom--md">
+		<van-swipe-item v-for="(banner, index) in showingBanners" :key="index">
 			<img :src="banner.src"  class="useraimg"/>
 		</van-swipe-item>
 	</van-swipe>
  
   
 	<div class="online bold rc-md-down" id="fixed-catbar-seperator"></div>
-   <!-- <div v-swiper:mySwiper="swiperOption" class="swiperWrap">
-        <div class="swiper-wrapper">
-            <div class="swiper-slide" v-for="(banner,index ) in banners" :key="index">
-                <img :src="banner.src">
-            </div>
-        </div>
-        <div class="swiper-pagination swiper-pagination-bullets"></div>
-  </div> -->
 	<div class="rc-max-width--xl">
 		<div class="usermain">
 			<div :class="searchBar?'rc-ma':'rc-ma searchBara'">
 				<div v-if="!searchBar" class="online bold rc-md-down"></div>
-			<ul class="ul-zhuan rc-margin-y--xl">
+				<ul class="ul-zhuan rc-margin-y--md">
 					<li 
 						v-for="(item, index) in discountlist"
 						:key="index"
@@ -50,11 +42,13 @@
 	        <div class="swiper-container rc-full-width rc-padding-y--md" id="swiper1">
 	           <h2 class="rc-beta rc-text--center">{{usertitle}}</h2>
 	             <!-- 轮播图 -->
-            <swiper :options="swiperOption">
-                <swiper-slide class="swiper-slide" v-for="(item, key) in catlistvideo" :key="key" >
+	            <van-swipe class="rc-padding-bottom--md">
+					<van-swipe-item v-for="(item, index) in catlistvideo" :key="index">
 						<div class="rc-video">
 							<div class="uservideo">
-            
+								<video controls="" :poster=item.catimage>
+									<source :src=item.video type="video/mp4">
+								</video>
 							</div>
 
 						   <div class="rc-right">
@@ -68,8 +62,8 @@
 						<div class="sw-center" >
 							<div class="rc-click"  @click="selectproduce(item,index)">
 								<div class="uservideo">
-									<video width="300px" height="251" controls="controls">
-										<source :src= item.video type="video/ogg" autoplay>
+									<video controls="controls" :poster=item.catimage>
+										<source :src= item.video type="video/ogg">
 									</video>
 								</div>
 
@@ -82,9 +76,8 @@
 								<i @click="userbuy(item,index)" class="ts-standard-btn ts-standard-btn--two center">立即购买</i>
 							</div>
 						</div>
-       
-                </swiper-slide>
-            </swiper>
+					</van-swipe-item>
+				</van-swipe>
 	        </div>
 	
 	
@@ -280,16 +273,18 @@
 	  <div class="online bold" v-show="dogshow"></div>
 	     <div class="pageFullScreen" id="xxxFullScreen" v-show="dogshow" ref="mingxing">
 	        <!-- 内容 -->
-        <div class="swiper-container rc-full-width rc-padding-y--md" id="swiper1">
+	        <div class="swiper-container rc-full-width rc-padding-y--md" id="swiper2">
 	          <div class="oc-top">
 	           <h2 class="rc-beta rc-text--center">{{dogtitle}}</h2>
 	           </div>
 	             <!-- 轮播图 -->
-            <swiper :options="swiperOption">
-                <swiper-slide class="swiper-slide" v-for="(item, key) in doglistvideo" :key="key" >
+				 <van-swipe class="rc-padding-bottom--md">
+				 	<van-swipe-item v-for="(item, key) in doglistvideo" :key="key">
 	                  <div class="rc-video">
 	                    <div class="uservideo">
-            
+							<video controls="" :poster=item.catimage>
+								<source :src=item.video type="video/mp4">
+							</video>
 	                    </div>
 	               
 	                   <div class="rc-right">
@@ -303,8 +298,8 @@
 	                         <div class="sw-center" >
 								<div class="rc-click"  @click="selectproduce(item,index)">
 									<div class="uservideo">
-									<video width="300px" height="251" controls="controls">
-										<source :src= item.video type="video/ogg" autoplay>
+										<video controls="controls">
+											<source :src= item.video type="video/ogg">
 										</video>
 									</div>
 	                    
@@ -318,15 +313,17 @@
 								</div>
 	                         </div>
 	       
-                </swiper-slide>
-            </swiper>
+	                </van-swipe-item>
+	            </van-swipe>
 	        </div>
 	
 	
+	
 	</div>
 	
 	<div class="online bold" v-show="threemao"></div>
 	
+	
 	   <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>
 	<van-tabs @change='userdog' class="van-tabs">
@@ -707,11 +704,9 @@
 </template>
   <script>
   let vm=null;
-  import $ from 'jquery'
   import Myheader from "~/components/header.vue";
   import Myfooter from "~/components/rc-footer.vue";
   import unlogin from "~/components/unlogin.vue";
-  import '@vant/touch-emulator';
   import { userquery,postCourseId,biaomessage,userque,searchchanpin } from "../ajax/getData";
   const settings = require("@/config");
   export default {
@@ -773,7 +768,6 @@ activeInde3:0,
         selection:[
 			{
 				title: "幼猫",
-            
 			},
 			{
 				title: "成猫",
@@ -783,21 +777,24 @@ activeInde3:0,
 			},
 			{
 				title: "品种猫",
-          
 			},
 			{
 				title: "亚健康",
-          
 			},
 		],
-
-                     banners:[
-                {src:require("../assets/image/one.jpg"),link:""},
-                {src:require("../assets/image/two.jpg"),link:""},
-                {src:require("../assets/image/three.jpg"),link:""},
-                {src:require("../assets/image/four.jpg"),link:""},
+		banners:{
+			'mobile':[
+				{src:"/images/banner/one.jpg",link:""},
+				{src:"/images/banner/two.jpg",link:""},
+				{src:"/images/banner/three.jpg",link:""},
+				{src:"/images/banner/four.jpg",link:""}
 			],
-
+			'pc':[
+				{src:"/images/banner/pc-banner1.png",link:""},
+				{src:"/images/banner/pc-banner2.png",link:""}
+			]
+		},	
+		showingBanners:[],
 		userdoglist: [
         {
           title: "小型犬",
@@ -916,29 +913,29 @@ activeInde3:0,
 		catlistvideo: [
         {
 			title: "明星猫粮",
-            video:require("../assets/cat/one.mp4"),
-             catimage: require("../assets/cat/one.jpg"),
+			video:"/images/cat/one.mp4",
+			catimage: "/images/cat/one.jpg",
 			detail:'为10月龄及以上英国短毛猫成猫量身打造的精准营养',
 			price:'¥123.45',
         },
         {
           title: "猫湿粮",
-         video:require("../assets/cat/two.mp4"),
-          catimage: require("../assets/cat/two.jpg"),
+         video:"/images/cat/two.mp4",
+          catimage: "/images/cat/two.jpg",
             detail:'为10月龄及以上英国短毛猫成猫量身打造的精准营养',
              price:'¥123.45',
         },
         {
 			title: "猫干粮",
-          video:require("../assets/cat/three.mp4"),
-           catimage: require("../assets/cat/three.jpg"),
+			video:"/images/cat/three.mp4",
+			catimage: "/images/cat/three.jpg",
 			detail:'为10月龄及以上英国短毛猫成猫量身打造的精准营养',
 			price:'¥123.45',
         },
 		{
 			title: "猫干粮",
-          video:require("../assets/cat/four.mp4"),
-           catimage: require("../assets/cat/four.jpg"),
+			video:"/images/cat/four.mp4",
+			catimage: "/images/cat/four.jpg",
 			detail:'为10月龄及以上英国短毛猫成猫量身打造的精准营养',
 			price:'¥123.45',
         },
@@ -948,29 +945,29 @@ activeInde3:0,
 		doglistvideo: [
         {
           title: "明星狗粮",
-            video:require("../assets/dog/one.mp4"),
-             catimage: require("../assets/dog/one.jpg"),
+            video:"/images/dog/one.mp4",
+             catimage: "/images/dog/one.jpg",
              detail:'为10月龄及以上成犬量身打造的精准营养',
              price:'¥123.45',
         },
         {
           title: "狗湿粮",
-         video:require("../assets/dog/two.mp4"),
-          catimage: require("../assets/dog/two.jpg"),
+         video:"/images/dog/two.mp4",
+          catimage: "/images/dog/two.jpg",
             detail:'为10月龄及以上英国成犬量身打造的精准营养',
              price:'¥123.45',
         },
         {
           title: "狗干粮",
-          video:require("../assets/dog/three.mp4"),
-           catimage: require("../assets/dog/three.jpg"),
+          video:"/images/dog/three.mp4",
+           catimage: "/images/dog/three.jpg",
              detail:'为10月龄及以上英国犬成犬量身打造的精准营养',
              price:'¥123.45',
         },
             {
           title: "狗干粮",
-          video:require("../assets/dog/four.mp4"),
-           catimage: require("../assets/dog/four.jpg"),
+          video:"/images/dog/four.mp4",
+           catimage: "/images/dog/four.jpg",
              detail:'为10月龄及以上英国成犬量身打造的精准营养',
              price:'¥123.45',
         },
@@ -999,7 +996,6 @@ activeInde3:0,
           title: "皇家英国短毛猫全价湿粮",
           price:'￥123.45',
           ordernum: 1,
-
           catimage: require("../assets/image/rc-cat.png"),
         },
 
@@ -1065,12 +1061,12 @@ activeInde3:0,
 				},
                 on: {
 					slideChange(Swiper) {
-                        console.log('onSlideChangeEnd',this);
+                        //console.log('onSlideChangeEnd',this);
                           // vm.ifadroind('','',this.realIndex);
                         vm.useraindex=this.realIndex;
                     },
                     tap() {
-                        console.log('onTap', this);
+                        //console.log('onTap', this);
                     }
                     // slideChange() {
                     //     console.log('onSlideChangeEnd', this);
@@ -1092,18 +1088,12 @@ activeInde3:0,
 		vm=this;
 	},
 	watch:{
+
 	},
     mounted(){
 		const that = this
-    this.ifAdoid()
-      //          window.onresize = () => {
-      //   setTimeout(() => {
-      //         this.ifAdoid()
-      //   }, 500);
-    
-      // }
+		this.ifAdoid();
 		this.usermessage= JSON.parse(localStorage.getItem("userInfo"));
-           
 		if(this.usermessage==null ||this.usermessage==undefined){
 			this.userunlogin=true
 		}
@@ -1111,19 +1101,13 @@ vm=this;
 		this.userchufang();//查询处方粮商品信息
 		this.catmessage();//查询猫的信息
 		this.dogmessage();//查询狗的信息
-      // this.usershi();//查询对应的标签
-      // this.userhot();
-
 	},
 	destroyed () {
 		window.removeEventListener('scroll', this.scrollToTop); 
 	},
     methods:{
-
-
-
 		ifAdoid(item,index){
- console.log(index);
+				//console.log(index);
 				this.userindex=index;
 				var sUserAgent = navigator.userAgent.toLowerCase();
 				var bIsIpad = sUserAgent.match(/ipad/i) == "ipad";
@@ -1134,15 +1118,11 @@ vm=this;
 				var bIsAndroid = sUserAgent.match(/android/i) == "android";
 				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("当前是电脑打开")
 				this.stypechange=false;
-     console.log(this.usertitle)
+				//console.log(this.usertitle)
 
-    //  let catshiid=document.querySelectorAll('.selectionswitch');
-    //  catshiid[this.userindex].style.display='none';
-    //     catshiid[this.userindex].style.display='none';
 				this.catproduct=true;
 				this.onemao=false;
 				this.twomao=false;
@@ -1151,9 +1131,12 @@ vm=this;
 				this.fivemao=false;
 				this.sixmao=false;
 				this.dogshow=false
-      // console.log(catshiid);
-    }else{
+				this.showingBanners=this.banners.pc;
+			}
+			else
+			{
 				console.log("当前是手机打开")
+				this.showingBanners=this.banners.mobile;
 				this.stypechange=true;
 				this.onemao=true;
 				this.twomao=true;
@@ -1168,7 +1151,7 @@ vm=this;
 		},
 
 		ifadroind(item,index,order){
-                console.log(item,index,order);
+			//console.log(item,index,order);
 
 
 			var sUserAgent = navigator.userAgent.toLowerCase();
@@ -1182,7 +1165,7 @@ vm=this;
 			var bIsWM = sUserAgent.match(/windows mobile/i) == "windows mobile";
 
 		if (!(bIsIpad || bIsIphoneOs || bIsMidp || bIsUc7 || bIsUc || bIsAndroid || bIsCE || bIsWM)) {
-      console.log("当前是电脑打开啊啊啊")
+		  //console.log("当前是电脑打开啊啊啊")
 					if(item.title=='明星猫粮'){
 					   this.catproduct=true;
 					   this.twomao=false;
@@ -1191,12 +1174,14 @@ vm=this;
 					   this.fivemao=false;
 					   this.dogshow=false;
 					   this.sixmao=false;
+
 					   this.onemao=false;
+
 					}
 					if(item.title=='猫湿粮'){
 						this.onemao=true;
 						   this.dogshow=false;
-                    console.log(this.onemao);
+						//console.log(this.onemao);
 					   this.twomao=false;
 					   this.threemao=false;
 					   this.fourmao=false;
@@ -1260,11 +1245,11 @@ vm=this;
 				this.catfood=true;
 				// this.catproduct=false;  
 				let userindex=index
-  console.log(item,index);
+				//console.log(item,index);
 				let mingxin=document.querySelector('.pageFullScreen');
 				let dogtop=document.querySelector('.oc-top');
-   console.log(dogtop);
-console.log(mingxin.offsetTop);
+				//console.log(dogtop);
+				//console.log(mingxin.offsetTop);
 				if(item.title=='犬湿粮'||item.title=='犬干粮'||item.title=='处方用粮'){
 				userindex=userindex-2
 				}else{
@@ -1286,8 +1271,7 @@ dogtop.scrollIntoView(true);
 				//    this.catfood=false;
 
 				//  }
-  console.log("当前是手机打开")
-  
+				//console.log("当前是手机打开")
 			}
 		},
 		userdog(item,index){
@@ -1330,11 +1314,12 @@ dogtop.scrollIntoView(true);
        },
     handleScroll(e) 
 	{
+		let fixedCatbarSeperator = document.getElementById("fixed-catbar-seperator");
+		if(!fixedCatbarSeperator)
+		{
+			return;
+		}
 		let scrolltop = document.documentElement.scrollTop || document.body.scrollTop;
-		let fixedCatbarSeperator = document.querySelector("#fixed-catbar-seperator");
-    // console.log(fixedCatbarSeperator.offsetTop,scrolltop);
-    if(fixedCatbarSeperator!=='null' &&fixedCatbarSeperator!=='underfined'){
-       console.log('-====');
 		if((scrolltop-fixedCatbarSeperator.offsetTop)>0)
 		{
 			this.gotop = true
@@ -1370,9 +1355,9 @@ dogtop.scrollIntoView(true);
 		async catmessage(stype) {
 			let data=[];
 			if(stype==undefined||stype==null){
-             data = await biaomessage(0);
+				data = await biaomessage(0,'',1,6);
 			}else{
-              data = await biaomessage(this.userserachlist);
+				data = await biaomessage(this.userserachlist,'',1,6);
 			}
 			if(data){
 				this.catlist=data;
@@ -1380,10 +1365,7 @@ dogtop.scrollIntoView(true);
 				userlist=data.slice(0,6);
 				this.catshi=userlist;
 				this.catgan=userlist;
-        
-
 			}
-
 		},
 
          //请求犬