Product list & search list completed

rc-busness/assets/css/search.less

@@ -230,7 +230,7 @@ margin-left: 0.18rem;
         display: block;
         margin-left: 0.5rem;
         display: block;
-    
+		cursor: pointer;
       }
     }
   
@@ -390,7 +390,7 @@ border-radius: 100px;
 	h2{
 		font-weight: bold;
 		color: #333333;
-
+		width: 3.25rem;
 	}
 }
     .rc-padding--md{
@@ -452,6 +452,7 @@ cursor: pointer;
 /deep/.el-dialog {
   width: 920px;
   background: #FFFFFF;
+  max-width:unset;
   }
   /deep/.van-search__action{
     display: block;
@@ -511,7 +512,7 @@ margin-left: 8px;
         display: block;
         margin-left: 0.5rem;
         display: block;
-    
+		cursor:pointer;
       }
     }
   
@@ -624,6 +625,7 @@ border-radius: 30px;
   }
   /deep/.van-search{
     padding-left: 0;
+	width:100%;
   }
   .van-search__content--square{
         display: flex;
@@ -632,7 +634,7 @@ border-radius: 30px;
         background: white;
         border: 1px solid #D7D7D7;
         height: 50px;
-        width: 1200px;
+		width:100%;
         border-radius: 200px;
   }
   /deep/.van-field__left-icon
@@ -669,6 +671,7 @@ border-radius: 30px;
 		align-items: center;
 		justify-content: center;
 		margin-left: 32px;
+		cursor: pointer;
     }
     li:first-child{
       margin-left: 0;

rc-busness/pages/index.vue

@@ -995,7 +995,7 @@
 			title: "主食级狗湿粮",
 			video:"/images/dog/one.mp4",
 			catimage: "/images/dog/one.jpg",
-			productimage: "/images/cat/star-1.png",
+			productimage: "/images/dog/star-1.png",
 			detail:'柔软细腻慕斯 适合离乳期幼犬舔食',
 			price:'¥77',
         },

rc-busness/pages/productdetails/productlist.vue

@@ -481,8 +481,9 @@ export default {
 	  let stype = this.routeParams.stype;
 	  stype = (stype=='0'?0:1);
 	  
-	  if(stype>-1)
+	  if(stype>-1){
 		  this.activeIndex = this.routeParams.stype;//Initialized pet type selection
+	  }
   },
   mounted() {
 	
@@ -492,6 +493,7 @@ export default {
 	let tagSettingPromise = this.userst();
 	let _self = this;
 	tagSettingPromise.then(function(resolve){
+		_self.selectGoods(null,_self.activeIndex,true);
 		_self.chooseDefaultOptions();
 		//_self.usetmessage();
 	});
@@ -508,7 +510,7 @@ export default {
 		this.isLoading=true;
 		let data = undefined;
 		if(this.prefecture[this.rxGoodsIndexPointer].checked==true){
-			data = await userquery(usertype, 1, 10);
+			data = await userquery(usertype, 1, 12);
 		}
 		else{
 			let searchCriteria=[{}];
@@ -525,7 +527,7 @@ export default {
 					}
 				}
 			}
-			data = await searchchanpin(searchCriteria, usertype, 1, 10);
+			data = await searchchanpin(searchCriteria, usertype, 1, 12);
 		}
 		if (data) {
 			this.rccontair = data;
@@ -543,7 +545,7 @@ export default {
         this.userstype = data;
         this.isLoading = false;
       }
-      this.usercatlist = this.userstype.filter((item) => item.petType == this.activeIndex);
+      this.usercatlist = this.userstype.filter((item) => item.petType == "0");
       this.usercatlist.map((element) => {
         if (element.name == "品种") {
           pinzhong.push(element);
@@ -700,6 +702,25 @@ export default {
 		else
 			this.prefecture[this.rxGoodsIndexPointer].checked=false;
 	},
+	resetAllOptions(){
+		let _self = this;
+		let categoriesSelectionEles=this.prefecture;
+		let functionalSelectionEles=this.catagea;
+		let ageSelectionEles=this.catage;
+		let breedSelectionEles=this.catageb;
+		let allSelectionEles=categoriesSelectionEles.concat(functionalSelectionEles,ageSelectionEles,breedSelectionEles);
+		allSelectionEles.forEach(function(tmp,index){
+			tmp.checked=false;
+		});
+		this.userserachlist = [
+			{
+				categoryName: [], //专区
+				tagUsedAge: [], //年龄
+				tagFunction: [], //功能
+				tagBreed: [], //品种
+			},
+		];
+	},
     userbuy() {
       this.$router.push({
         path: "/myorder/userrecord",
@@ -760,24 +781,13 @@ export default {
       }
     },
 
-    selectGoods(item, index) {
+    selectGoods(item, index, onlyRefreshCategory) {
       this.activeIndex1 = index;
       this.activeIndex = index;
       this.allacindex = index;
+	  this.resetAllOptions();
+		if(!onlyRefreshCategory)
 			this.usersearch(this.userserachlist, this.activeIndex1);
-      // for (let i = 0; i < this.userserachlist.length; i++) {
-      //   if (!this.userserachlist.includes(petType)) {
-      //     this.userserachlist.push(petType);
-      //   }
-      // }
-		this.userserachlist = [
-			{
-				categoryName: [], //专区
-				tagUsedAge: [], //年龄
-				tagFunction: [], //功能
-				tagBreed: [], //品种
-			},
-		];
       let pinzhong = [];
       let zhuanqu = [];
       let age = [];

rc-busness/pages/usersearch/search.vue

@@ -100,7 +100,7 @@
     </div>
     <div class="online"></div>
     <!-- rc-main start -->
-    <div class="rc-max-width--xl">
+    <div class="rc-max-width--xl rc-margin-bottom--lg">
       <div class="usersearch">
         <div class="rc-contair">
           <ul class="ts-product-list">
@@ -120,7 +120,7 @@
               <div class="rc-column">
                 <div class="rc-click" @click="selectproduce(item)">
                   <span>{{ item.categoryName }}</span>
-                  <i>￥{{ item.ecPrice }}</i>
+                  <i>{{ item.ecPrice?("￥"+item.ecPrice):'' }}</i>
                 </div>
                 <strong
                   class="
@@ -313,6 +313,11 @@
       </el-dialog>
     </div>
     <!-- rc-main end -->
+	<div v-if="isLoading" class="ts-mask">
+		<div class="ts-mask-bg"></div>
+		<div class="userloding"></div>
+		<span>数据加载中</span>
+	</div>
       <MyFooter></MyFooter>
   </div>
 </template>
@@ -320,7 +325,7 @@
 <script>
 import Myheader from "~/components/header.vue";
 import MyFooter from '~/components/rc-footer.vue'
-import { biaome, userstype, searchchanpin } from "../../ajax/getData";
+import { biaome, userstype, searchchanpin, userquery } from "../../ajax/getData";
 export default {
   data() {
     return {
@@ -329,14 +334,14 @@ export default {
 
       userserachlist: [
         {
-          categoryName: "", //专区
+          categoryName: [], //专区
-          tagUsedAge: "", //年龄
+          tagUsedAge: [], //年龄
-          tagFunction: "", //功能
+          tagFunction: [], //功能
-          tagBreed: "", //品种
+          tagBreed: [], //品种
         },
       ],
       userstype: [],
-      activeIndex: "-1",
+      activeIndex: "0",
       activeIndex1: 0,
       activeIndexa: "-1",
       // userpeolist:[
@@ -405,7 +410,14 @@ export default {
           catimage: require("../../assets/image/rc-dog.png"),
         },
       ],
-
+		extraPrefecture: [
+		  {
+			tagName: "处方粮",
+			ordernum: "99",
+			catimage: require("../../assets/image/rc-dog.png"),
+			isRxGoods:1
+		  },
+		],
       prefecture: [
         {
           title: "猫湿粮",
@@ -485,36 +497,11 @@ export default {
 
 		rccontair: [
 			{
-          title: "皇家英国短毛猫全价湿粮",
+				title: "",
-          price: "￥123.45",
+				price: "",
 				ordernum: 1,
 
-          catimage: require("../../assets/image/rc-cat.png"),
+				catimage: '',
-        },
-
-        {
-          title: "皇家英国短毛猫全价湿粮",
-          price: "￥123.45",
-          ordernum: "2",
-          catimage: require("../../assets/image/rc-dog.png"),
-        },
-        {
-          title: "皇家英国短毛猫全价湿粮",
-          price: "￥123.45",
-          ordernum: "2",
-          catimage: require("../../assets/image/rc-dog.png"),
-        },
-        {
-          title: "皇家英国短毛猫全价湿粮",
-          price: "￥123.45",
-          ordernum: "2",
-          catimage: require("../../assets/image/rc-dog.png"),
-        },
-        {
-          title: "皇家英国短毛猫全价湿粮",
-          price: "￥123.45",
-          ordernum: "2",
-          catimage: require("../../assets/image/rc-dog.png"),
 			},
 		],
       usercatlist: [],
@@ -578,9 +565,31 @@ export default {
     },
 
     async usersearch(stype, usertype) {
-      let data = await searchchanpin(stype, usertype, 1, 10);
+		this.isLoading=true;
+		let data = undefined;
+		if(this.prefecture[this.rxGoodsIndexPointer].checked==true){
+			data = await userquery(usertype, 1, 12);
+		}
+		else{
+			let searchCriteria=[{}];
+			for(let key in stype[0]){
+				if(stype[0][key].length>0){
+					if(typeof stype[0][key] == 'string') {
+						searchCriteria[0][key]=stype[0][key];
+					}
+					else {
+						searchCriteria[0][key]=stype[0][key].join(',');
+					}
+					if(key=='categoryName' && searchCriteria[0][key].indexOf("湿")>-1){
+						searchCriteria[0]['tagStatus']=2;
+					}
+				}
+			}
+			data = await searchchanpin(searchCriteria, usertype, 1, 12);
+		}
 		if (data) {
 			this.rccontair = data;
+			this.isLoading=false;
 		}
     },
     async userst() {
@@ -630,7 +639,11 @@ export default {
           });
         }
       });
-
+	  let _self = this;
+	  this.extraPrefecture.forEach(function(ele){
+		  _self.prefecture.push(ele);
+		  _self.rxGoodsIndexPointer = _self.prefecture.length-1;
+	  });
       this.userdoglisgt = this.userstype.filter((item) => item.petType == "1");
     },
 
@@ -657,6 +670,46 @@ export default {
         },
       });
     },
+	checkRxGoods(toggleSwitch){
+		let _self = this;
+		let categoriesSelectionEles=this.prefecture;
+		let functionalSelectionEles=this.catagea;
+		let ageSelectionEles=this.catage;
+		let breedSelectionEles=this.catageb;
+		let allSelectionEles=categoriesSelectionEles.concat(functionalSelectionEles,ageSelectionEles,breedSelectionEles);
+		
+		if(toggleSwitch)
+		{
+			allSelectionEles.forEach(function(tmp,index){
+				tmp.checked=false;
+				if(tmp.isRxGoods)
+				{
+					tmp.checked=true;
+				}
+			});
+		}
+		else
+			this.prefecture[this.rxGoodsIndexPointer].checked=false;
+	},
+	resetAllOptions(){
+		let _self = this;
+		let categoriesSelectionEles=this.prefecture;
+		let functionalSelectionEles=this.catagea;
+		let ageSelectionEles=this.catage;
+		let breedSelectionEles=this.catageb;
+		let allSelectionEles=categoriesSelectionEles.concat(functionalSelectionEles,ageSelectionEles,breedSelectionEles);
+		allSelectionEles.forEach(function(tmp,index){
+			tmp.checked=false;
+		});
+		this.userserachlist = [
+			{
+				categoryName: [], //专区
+				tagUsedAge: [], //年龄
+				tagFunction: [], //功能
+				tagBreed: [], //品种
+			},
+		];
+	},
     userbuy() {
       this.$router.push({
         path: "/myorder/userrecord",
@@ -713,8 +766,10 @@ export default {
     onSearch(e) {
       this.usetmessage(this.activeIndex1, this.value);
     },
-    selectGoods(item, index) {
+    selectGoods(item, index, onlyRefreshCategory) {
       this.activeIndex1 = index;
+	  this.resetAllOptions();
+	  if(!onlyRefreshCategory)
 		this.usersearch(this.userserachlist, this.activeIndex1);
       let pinzhong = [];
       let zhuanqu = [];
@@ -772,7 +827,11 @@ export default {
           }
         });
       }
-
+		let _self = this;
+		this.extraPrefecture.forEach(function(ele){
+			_self.prefecture.push(ele);
+			_self.rxGoodsIndexPointer = _self.prefecture.length-1;
+		});
       this.activeIndex = index;
     },
     selectGoodsa(item, index) {
@@ -839,6 +898,17 @@ export default {
       this.activeIndexa = index;
       this.usetmessage(item.title);
     },
+	utilSimpleArrayRemove(haystack,needle){
+		if(haystack.length<=0)
+			return false;
+		let index=haystack.indexOf(needle);
+		if(index>-1)
+		{
+			haystack.splice(index,1);
+			return true;
+		}
+		return false;
+	},
     selectage(item, index) {
         if(this.activeIndex=='-1'){
          this.activeIndex=0;
@@ -846,26 +916,14 @@ export default {
       // debugger;
       // this.userishwo1 = !this.userishwo1;
       let tagUsedAge = {};
-      // this.userishwo1 = !this.userishwo1;
+      this.activeIndexc = index;
+      item.checked = !item.checked;
       if (item.checked == false) {
-        item.checked = true;
+      	this.utilSimpleArrayRemove(this.userserachlist[0].tagUsedAge,item.tagName);
-        this.userserachlist[0].tagUsedAge = item.tagName;
-        this.$refs.chosebox1[index].className = "active";
       } else {
-        this.userserachlist[0].tagUsedAge = "";
+      	this.userserachlist[0].tagUsedAge.push(item.tagName);
-        item.checked = false;
-        this.$refs.chosebox1[index].className = "unactive";
       }
-      // if (this.userishwo1 == false) {
+      
-      //   tagUsedAge = {
-      //     petType: this.activeIndex1,
-      //     tagUsedAge: item.tagName,
-      //   };
-      // } else {
-      //   tagUsedAge = {
-      //     petType: this.activeIndex1,
-      //   };
-      // }
       // for (let i = 0; i < this.userserachlist.length; i++) {
       //   if (!this.userserachlist.includes(tagUsedAge)) {
       //     this.userserachlist.push(tagUsedAge);
@@ -875,13 +933,11 @@ export default {
       this.activeIndexc = index;
     },
     selectagc(item, index) {
+		this.checkRxGoods(false);
         if(this.activeIndex=='-1'){
          this.activeIndex=0;
        }
-      // let tagFunction = {
+	   /*
-      //   petType: this.activeIndex1,
-      //   tagFunction: item.tagName,
-      // };
       if (item.checked == false) {
         item.checked = true;
         this.$refs.cgosebox4[index].className = "active";
@@ -891,16 +947,20 @@ export default {
         this.$refs.cgosebox4[index].className = "unactive";
         this.userserachlist[0].tagFunction = "";
       }
-
-      // for (let i = 0; i < this.userserachlist.length; i++) {
-      //   if (!this.userserachlist.includes(tagFunction)) {
-      //     this.userserachlist.push(tagFunction);
-      //   }
-      // }
       this.usersearch(this.userserachlist, this.activeIndex1);
       this.activeIndexd = index;
+	  */
+	 this.activeIndexd = index;
+	 item.checked = !item.checked;
+	 if (item.checked == false) {
+	 	this.utilSimpleArrayRemove(this.userserachlist[0].tagFunction,item.tagName);
+	 } else {
+	 	this.userserachlist[0].tagFunction.push(item.tagName);
+	 }
+	 this.usersearch(this.userserachlist, this.activeIndex1);
     },
     selectagd(item, index) {
+		/*
         if(this.activeIndex=='-1'){
          this.activeIndex=0;
        }
@@ -914,25 +974,26 @@ export default {
         this.$refs.chosebox3[index].className = "unactive";
         this.userserachlist[0].tagBreed = "";
       }
-      // if (this.userishwo3 == false) {
-      //   tagBreed = {
-      //     petType: this.activeIndex1,
-      //     tagBreed: item.tagName,
-      //   };
-      // } else {
-      //   tagBreed = {
-      //     petType: this.activeIndex1,
-      //   };
-      // }
-      // for (let i = 0; i < this.userserachlist.length; i++) {
-      //   if (!this.userserachlist.includes(tagBreed)) {
-      //     this.userserachlist.push(tagBreed);
-      //   }
-      // }
       this.usersearch(this.userserachlist, this.activeIndex1);
       this.activeIndexe = index;
+	  */
+	 this.checkRxGoods(false);
+	 if(this.activeIndex=='-1'){
+	 	this.activeIndex=0;
+	 }
+	 let tagBreed = {};
+	 this.activeIndexe = index;	
+	 item.checked = !item.checked;
+	 if (item.checked == false) {
+	 	this.utilSimpleArrayRemove(this.userserachlist[0].tagBreed,item.tagName);
+	 } else {
+	 	this.userserachlist[0].tagBreed.push(item.tagName);
+	 }
+	 this.usersearch(this.userserachlist, this.activeIndex1);
     },
+	
     selectproduct(item, index) {
+		/*
       this.activeIndexb = index;
        console.log(this.activeIndex);
        if(this.activeIndex=='-1'){
@@ -947,25 +1008,37 @@ export default {
         this.$refs.chosebox[index].className = "unactive";
         this.userserachlist[0].categoryName = "";
       }
-      // this.userishwo = !this.userishwo;
+      this.usersearch(this.userserachlist, this.activeIndex1);
-      // if (this.userishwo == false) {
+	  */
-      //   categoryName = {
+		if(this.activeIndex=='-1'){
-      //     petType: this.activeIndex1,
+			this.activeIndex=0;
-      //     categoryName: item.tagName,
+		}
-      //   };
+		this.activeIndexb = index;
-      // } else {
+		let _self=this;
-      //   categoryName = {
+		//Handling Rx Goods
-      //     petType: this.activeIndex1,
+		if(item.isRxGoods==1)
-      //   };
+		{
-      // }
+			this.checkRxGoods(true);
-      console.log(this.userserachlist[0].categoryName);
+		}
-      // for (let i = 0; i < this.userserachlist.length; i++) {
+		//Handling Rx Goods end
-      //   if (!this.userserachlist.includes(categoryName)) {
-      //     this.userserachlist.push(categoryName);
-      //   }
-      //   console.log(this.userserachlist);
-      // }
 		
+		//Handling other options
+		else {
+			//  console.log(this.userishwo=!this.userishwo)
+			this.checkRxGoods(false);
+			
+			//item.checked = !item.checked;
+			//this.prefecture[index].checked = item.checked;
+			item.checked = !item.checked;
+			this.prefecture[index].checked = item.checked;
+			if (item.checked == false) {
+				this.utilSimpleArrayRemove(this.userserachlist[0].categoryName,item.tagName);
+			} else {
+				this.userserachlist[0].categoryName.push(item.tagName);
+			}
+
+		}
+		//Handling other options end
 		this.usersearch(this.userserachlist, this.activeIndex1);
     },