From 4a1d1b9dd624a584eac0048f145a51cd76d29c45 Mon Sep 17 00:00:00 2001 From: Vion Date: Fri, 21 Jan 2022 18:12:45 +0800 Subject: [PATCH] Product list function completed --- rc-busness/ajax/getData.js | 2 +- rc-busness/assets/css/global.less | 7 +- rc-busness/assets/css/index.less | 8 + rc-busness/assets/css/product-list.less | 2 +- rc-busness/components/addressInput.vue | 24 +- rc-busness/pages/index.vue | 28 +- .../pages/productdetails/productlist.vue | 506 +++++++++++------- 7 files changed, 361 insertions(+), 216 deletions(-) diff --git a/rc-busness/ajax/getData.js b/rc-busness/ajax/getData.js index 2efb2607..6fe65551 100644 --- a/rc-busness/ajax/getData.js +++ b/rc-busness/ajax/getData.js @@ -187,7 +187,7 @@ export const userquery = (stype) => { goodsName:stype } - return fetch('goods?goodsName='+stype, data, 'POST' ) + return fetch('goods?petType='+stype, data, 'POST' ) } //商品全部信息 export const userque = (stype) => { diff --git a/rc-busness/assets/css/global.less b/rc-busness/assets/css/global.less index 4c1f0fd5..d7d9399e 100644 --- a/rc-busness/assets/css/global.less +++ b/rc-busness/assets/css/global.less @@ -432,7 +432,8 @@ img, picture { } .ts-product-list{ text-align: left; - display:block; + //display:block; + display:flex; li{ max-width:20rem; min-width:18.75rem; @@ -621,8 +622,8 @@ img, picture { display:flex; //justify-content: space-between; li{ - //margin-left:0; - //margin-right:0; + margin-left:0; + margin-right:0; } } } diff --git a/rc-busness/assets/css/index.less b/rc-busness/assets/css/index.less index 77f4b563..e1ccdf93 100644 --- a/rc-busness/assets/css/index.less +++ b/rc-busness/assets/css/index.less @@ -383,6 +383,14 @@ } .ts-banner-swiper-container{ position:relative; + picture + { + min-height:12rem; + width:100%; + img{ + margin:0 auto; + } + } .ts-carousel-indicator{ position:absolute; bottom:.4rem; diff --git a/rc-busness/assets/css/product-list.less b/rc-busness/assets/css/product-list.less index b1fd2b92..7bcabaeb 100644 --- a/rc-busness/assets/css/product-list.less +++ b/rc-busness/assets/css/product-list.less @@ -571,7 +571,7 @@ border-radius: 30px; h2{ display: flex; align-items: center; - width: 4%; + width: 3.25rem; } .ts-scrollable{ width: 100%; diff --git a/rc-busness/components/addressInput.vue b/rc-busness/components/addressInput.vue index a60768aa..369e83ee 100644 --- a/rc-busness/components/addressInput.vue +++ b/rc-busness/components/addressInput.vue @@ -63,7 +63,11 @@ export default { { defaultValues = this.defaultValues; this.onConfirm(defaultValues); - } + } + else + { + this.defaultValues = defaultValues; + } //Initilizing end }, pickValue(pickId,pickName){ @@ -233,16 +237,18 @@ export default { popAddress() { this.show=true; let _self=this; - //mobile //const picker = this.selectComponent('.ts-area-picker-mobile-component'); - this.defaultValues.forEach(function(ele,index){ - let tmpPointer=parseInt(_self.inArray(ele,_self.columns[index].values)); - if(tmpPointer) - { - _self.columns[index].defaultIndex = tmpPointer; - } - }); + if(this.defaultValues && this.defaultValues.length>0) + { + this.defaultValues.forEach(function(ele,index){ + let tmpPointer=parseInt(_self.inArray(ele,_self.columns[index].values)); + if(tmpPointer) + { + _self.columns[index].defaultIndex = tmpPointer; + } + }); + } // setTimeout(function(){ // //debugger; diff --git a/rc-busness/pages/index.vue b/rc-busness/pages/index.vue index 9079d402..7f84721c 100644 --- a/rc-busness/pages/index.vue +++ b/rc-busness/pages/index.vue @@ -129,6 +129,7 @@
+
暂未发现相关记录
  • @@ -147,7 +148,7 @@
- +
查看更多
@@ -183,6 +184,7 @@
+
暂未发现相关记录
  • @@ -199,7 +201,7 @@
- +
查看更多
@@ -213,6 +215,7 @@
+
暂未发现相关记录
  • @@ -231,7 +234,7 @@
- +
查看更多
@@ -270,6 +273,7 @@
+
暂未发现相关记录
  • @@ -286,7 +290,7 @@
- +
查看更多
@@ -377,6 +381,7 @@
+
暂未发现相关记录
  • @@ -395,7 +400,7 @@
- +
查看更多
@@ -437,6 +442,7 @@
+
暂未发现相关记录
  • @@ -454,7 +460,7 @@
- +
查看更多
@@ -491,6 +497,7 @@
+
暂未发现相关记录
  • @@ -508,7 +515,7 @@
- +
查看更多
@@ -550,6 +557,7 @@
+
暂未发现相关记录
  • @@ -566,7 +574,7 @@
- +
查看更多
@@ -587,6 +595,7 @@
+
暂未发现相关记录
  • @@ -603,7 +612,7 @@
- +
查看更多
@@ -645,6 +654,7 @@
+
暂未发现相关记录
  • diff --git a/rc-busness/pages/productdetails/productlist.vue b/rc-busness/pages/productdetails/productlist.vue index 862c457d..746d1d17 100644 --- a/rc-busness/pages/productdetails/productlist.vue +++ b/rc-busness/pages/productdetails/productlist.vue @@ -1,9 +1,5 @@ @@ -311,26 +313,24 @@ import { biaome, biaomessage, searchchanpin, + userquery } from "../../ajax/getData"; export default { data() { return { value: "", - isLoading: true, + isLoading: false, userstype: [], - activeIndex: "-1", + activeIndex: 0, allacindex: 0, userishwo: true, - userishwo1: true, - userishwo2: true, - userishwo3: true, userishwo4: true, userserachlist: [ { - categoryName: "", //专区 - tagUsedAge: "", //年龄 - tagFunction: "", //功能 - tagBreed: "", //品种 + categoryName: [], //专区 + tagUsedAge: [], //年龄 + tagFunction: [], //功能 + tagBreed: [], //品种 }, ], activeIndex1: 0, @@ -393,28 +393,17 @@ export default { }, ], - prefecture: [ + extraPrefecture: [ { - title: "猫湿粮", - ordernum: "2", - catimage: require("../../assets/image/rc-dog.png"), - }, - { - title: "品种猫粮", - ordernum: "2", - catimage: require("../../assets/image/rc-dog.png"), - }, - { - title: "营养猫粮", - ordernum: "2", - catimage: require("../../assets/image/rc-dog.png"), - }, - { - title: "功能猫粮", - ordernum: "2", + tagName: "处方粮", + ordernum: "99", catimage: require("../../assets/image/rc-dog.png"), + isRxGoods:1 }, ], + prefecture: [ + + ], catage: [ { title: "<4月龄", @@ -472,63 +461,72 @@ export default { rccontair: [ { - title: "皇家英国短毛猫全价湿粮", - price: "￥123.45", + title: "", + price: "", ordernum: 1, - - catimage: require("../../assets/image/rc-cat.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"), - }, - { - title: "皇家英国短毛猫全价湿粮", - price: "￥123.45", - ordernum: "2", - catimage: require("../../assets/image/rc-dog.png"), + catimage: '', }, ], + routeParams:[], + rxGoodsIndexPointer:0 }; }, components: { Myheader, MyFooter }, + created() { + this.routeParams=this.$route.query; + if(this.routeParams.stype) + this.activeIndex = this.routeParams.stype;//Initialized pet type selection + }, mounted() { - let stype = this.$route.query.stype; - this.$nextTick(() => { - this.$refs.userstandard[0].style.margin = 0 + "px"; - }); - this.userst(); - // this.activeIndex = stype; - // if (stype !== "" && stype !== undefined) { - // this.onmessage(stype); - // } else { - // this.usetmessage(); - // } + let stype = this.routeParams.stype; + this.$nextTick(() => { + this.$refs.userstandard[0].style.margin = 0 + "px"; + }); + let tagSettingPromise = this.userst(); + let _self = this; + tagSettingPromise.then(function(resolve){ + _self.chooseDefaultOptions(); + //_self.usetmessage(); + }); + /* + if (stype !== "" && stype !== undefined) { + this.onmessage(stype);//Wont happen + } else { + this.usetmessage(); + } + */ }, methods: { async usersearch(stype, usertype) { - let data = await searchchanpin(stype, usertype, 1, 10); - if (data) { - this.rccontair = data; - } + this.isLoading=true; + let data = undefined; + if(this.prefecture[this.rxGoodsIndexPointer].checked==true){ + data = await userquery(usertype, 1, 10); + } + 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, 10); + } + if (data) { + this.rccontair = data; + this.isLoading=false; + } }, async userst() { this.isLoading = true; @@ -574,6 +572,11 @@ export default { console.log(pinzhong); // debugger }); + 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"); }, @@ -593,7 +596,106 @@ export default { this.isLoading = false; } }, - + chooseDefaultOptions(){ + let tagStatus = this.routeParams.tagStatus; + let categoryName = this.routeParams.categoryName; + let rxgoods = this.routeParams.rxgoods; + + let tagUsedAge = this.routeParams.tagUsedAge; + + let key = this.routeParams.key; + let _self = this; + + + if(tagStatus && tagStatus.length>0) { + tagStatus=='1'?1:2;//1:干粮, 2:湿粮 + } else { + tagStatus = 0; + } + if(rxgoods && rxgoods.length>0) { + rxgoods=='1'?1:0; + } else { + rxgoods = 0; + } + if(categoryName && categoryName.length>0) { + categoryName = categoryName.split(","); + } else { + categoryName = []; + } + if(tagUsedAge && tagUsedAge.length>0) { + tagUsedAge = tagUsedAge.split(","); + } else { + tagUsedAge = []; + } + + + + //RxGood handling + if(rxgoods) { + this.checkRxGoods(true); + this.usersearch([],this.activeIndex); + return; + } + //RxGood handling + + //Category Handling + if(tagStatus || categoryName.length>0) { + for(let item of this.prefecture){ + if(item.tagName.indexOf('湿')>-1){ + if(tagStatus==2) { + item.checked=true; + } + } else { + if(tagStatus==1 && item.tagName!=this.prefecture[this.rxGoodsIndexPointer].tagName){ + item.checked=true; + } + } + if(categoryName.indexOf(item.tagName)>-1) { + item.checked=true; + } + } + if(tagStatus) + this.userserachlist[0].tagStatus=tagStatus; + if(categoryName.length>0) + this.userserachlist[0].categoryName=categoryName; + } + //Category Handling end + + //Age Handling + if(tagUsedAge.length>0) { + this.catage.forEach(function(item,index){ + if(tagUsedAge.indexOf(item.tagName)>-1) { + item.checked=true; + } + }); + this.userserachlist[0].tagUsedAge=tagUsedAge; + } + //Age Handling end + + //go query + this.usersearch(this.userserachlist,this.activeIndex1); + }, + 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; + }, userbuy() { this.$router.push({ path: "/myorder/userrecord", @@ -636,20 +738,20 @@ export default { bIsWM ) ) { - console.log("当前是电脑打开"); + //console.log("当前是电脑打开"); this.$nextTick(() => { - this.isadrond = false; - this.dialogInfo1 = true; - this.isadrond = false; - this.isshow = false; + this.isadrond = false; + this.dialogInfo1 = true; + this.isadrond = false; + this.isshow = false; }); } else { - console.log("当前是手机打开"); + //console.log("当前是手机打开"); this.$nextTick(() => { - this.isadrond = true; - this.isshow = true; - this.$refs.usercontent.style.display = "none "; - this.dialogInfo1 = false; + this.isadrond = true; + this.isshow = true; + this.$refs.usercontent.style.display = "none "; + this.dialogInfo1 = false; }); } }, @@ -659,20 +761,19 @@ export default { this.activeIndex = index; this.allacindex = index; 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: "", //品种 - }, - ]; + this.userserachlist = [ + { + categoryName: [], //专区 + tagUsedAge: [], //年龄 + tagFunction: [], //功能 + tagBreed: [], //品种 + }, + ]; let pinzhong = []; let zhuanqu = []; let age = []; @@ -729,7 +830,12 @@ export default { }); } - this.activeIndex = index; + let _self = this; + this.extraPrefecture.forEach(function(ele){ + _self.prefecture.push(ele); + _self.rxGoodsIndexPointer = _self.prefecture.length-1; + }); + this.activeIndex = index; }, selectGoodsa(item, index) { this.activeIndex1 = index; @@ -746,109 +852,125 @@ export default { this.$refs.usercontent.style.display = "block "; }); }, - + 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; + }, selectsearch(item, index) { this.activeIndexa = index; }, selectage(item, index) { - if(this.activeIndex=='-1'){ - this.activeIndex=0; - } - let tagUsedAge = {}; - this.activeIndexc = index; - this.userishwo1 = !this.userishwo1; - console.log(this.userishwo1); - if (item.checked == false) { - item.checked = true; - this.userserachlist[0].tagUsedAge = item.tagName; - this.$refs.chosebox1[index].className = "active"; - } else { - this.userserachlist[0].tagUsedAge = ""; - item.checked = false; - this.$refs.chosebox1[index].className = "unactive"; - } + this.checkRxGoods(false); + if(this.activeIndex=='-1'){ + this.activeIndex=0; + } + let tagUsedAge = {}; + this.activeIndexc = index; + item.checked = !item.checked; + if (item.checked == false) { + this.utilSimpleArrayRemove(this.userserachlist[0].tagUsedAge,item.tagName); + } else { + this.userserachlist[0].tagUsedAge.push(item.tagName); + } - // for (let i = 0; i < this.userserachlist.length; i++) { - // if (!this.userserachlist.includes(tagUsedAge)) { - // this.userserachlist.push(tagUsedAge); - // } - // } - this.usersearch(this.userserachlist, this.activeIndex1); + // for (let i = 0; i < this.userserachlist.length; i++) { + // if (!this.userserachlist.includes(tagUsedAge)) { + // this.userserachlist.push(tagUsedAge); + // } + // } + this.usersearch(this.userserachlist, this.activeIndex1); }, selectagc(item, index) { - // let tagFunction = {}; - if(this.activeIndex=='-1'){ - this.activeIndex=0; - } - this.activeIndexd = index; - this.userishwo2 = !this.userishwo2; - if (item.checked == false) { - item.checked = true; - this.$refs.cgosebox4[index].className = "active"; - this.userserachlist[0].tagFunction = item.tagName; - } else { - item.checked = false; - this.$refs.cgosebox4[index].className = "unactive"; - this.userserachlist[0].tagFunction = ""; - } - // if (this.userishwo2 == false) { - // tagFunction = { - // petType: this.allacindex, - // tagFunction: item.tagName, - // }; - // } else { - // console.log("这是false"); - // tagFunction = { - // petType: this.allacindex, - // }; - // } - // 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.checkRxGoods(false); + // let tagFunction = {}; + if(this.activeIndex=='-1'){ + this.activeIndex=0; + } + 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); + } + + // if (this.userishwo2 == false) { + // tagFunction = { + // petType: this.allacindex, + // tagFunction: item.tagName, + // }; + // } else { + // console.log("这是false"); + // tagFunction = { + // petType: this.allacindex, + // }; + // } + // for (let i = 0; i < this.userserachlist.length; i++) { + // if (!this.userserachlist.includes(tagFunction)) { + // this.userserachlist.push(tagFunction); + // } + // } + this.usersearch(this.userserachlist, this.activeIndex1); }, selectagd(item, index) { - if(this.activeIndex=='-1'){ - this.activeIndex=0; - } - let tagBreed = {}; - this.activeIndexe = index; - this.userishwo3 = !this.userishwo3; - if (item.checked == false) { - item.checked = true; - this.$refs.chosebox3[index].className = "active"; - this.userserachlist[0].tagBreed = item.tagName; - } else { - item.checked = false; - this.$refs.chosebox3[index].className = "unactive"; - this.userserachlist[0].tagBreed = ""; - } - - // this.$refs.chosebox3[index].className = "unactive"; - // 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.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.$refs.chosebox3[index].className = "unactive"; + // for (let i = 0; i < this.userserachlist.length; i++) { + // if (!this.userserachlist.includes(tagBreed)) { + // this.userserachlist.push(tagBreed); + // } + // } + this.usersearch(this.userserachlist, this.activeIndex1); }, + //Fetching Categories Products selectproduct(item, index) { - if(this.activeIndex=='-1'){ - this.activeIndex=0; - } - this.activeIndexb = index; - // console.log(this.userishwo=!this.userishwo) - if (item.checked == false) { - item.checked = true; - this.$refs.chosebox[index].className = "active"; - this.userserachlist[0].categoryName = item.tagName; - } else { - item.checked = false; - this.$refs.chosebox[index].className = "unactive"; - this.userserachlist[0].categoryName = ""; - } + if(this.activeIndex=='-1'){ + this.activeIndex=0; + } + this.activeIndexb = index; + let _self=this; + //Handling Rx Goods + if(item.isRxGoods==1) + { + this.checkRxGoods(true); + } + //Handling Rx Goods end + + //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 // if (this.userishwo == false) { // console.log("===="); // categoryName = { @@ -866,10 +988,8 @@ export default { // this.userserachlist.push(categoryName); // } // } - - this.usersearch(this.userserachlist, this.activeIndex1); + this.usersearch(this.userserachlist, this.activeIndex1); }, - //弹框的显示隐藏 }, };