mirror of
https://gitee.com/lab1024/smart-admin.git
synced 2025-10-02 02:06:38 +08:00
1166 lines
34 KiB
Vue
1166 lines
34 KiB
Vue
<template>
|
||
<div>
|
||
<Myheader></Myheader>
|
||
<div class="rc-top"></div>
|
||
<tabs :crumbs="crumbs"></tabs>
|
||
<div class="rc-max-width--xl rc-main">
|
||
<div class="usersearch">
|
||
<div class="form-search">
|
||
<van-search
|
||
v-model="value"
|
||
show-action
|
||
placeholder="请输入搜索关键词"
|
||
@search="onSearch"
|
||
@cancel="onCancel"
|
||
class="rc-keyword"
|
||
>
|
||
<template #action>
|
||
<div @click="onSearch" class="rc-search">搜索</div>
|
||
</template>
|
||
</van-search>
|
||
<div class="ts-stand">
|
||
<span @click="onSearch" class="ts-standard-btn">搜索</span>
|
||
</div>
|
||
</div>
|
||
<div class="rc-max-width--xl rc-title">
|
||
<h2>热门搜索</h2>
|
||
<span class="rc-change" @click="userbatch">换一批</span>
|
||
</div>
|
||
<div class="rc-max-width--xl rc-variety">
|
||
<ul>
|
||
<li
|
||
v-for="(item, index) in searchdata"
|
||
:key="index"
|
||
@click="selectsearch(item, index)"
|
||
:class="activeIndexa == index"
|
||
>
|
||
{{ item.title }}
|
||
</li>
|
||
</ul>
|
||
</div>
|
||
<div class="usersearch rc-margin-top--md">
|
||
<div class="usercontentshow" ref="usercontent">
|
||
<div class="usercontentshow rc-product">
|
||
<h2>我想搜</h2>
|
||
<div class="rc-productcat ts-scrollable">
|
||
<ol>
|
||
<li
|
||
v-for="(item, index) in userproduct"
|
||
:key="index"
|
||
@click="selectGoods(item, index)"
|
||
:class="activeIndex == index ? 'active' : 'unactive'"
|
||
class="ts-standard-btn"
|
||
ref="userstandard"
|
||
>
|
||
<img :src="item.catimage" alt="" />
|
||
<span>{{ item.title }}</span>
|
||
</li>
|
||
</ol>
|
||
<div class="rc-productcat userselect" @click="userselect">
|
||
<img src="../../assets/image/rc-usericon.png" alt="" />
|
||
<span @click="usershow()">筛选</span>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="ts-scrollable-container">
|
||
<h2>专区:</h2>
|
||
<ol class="ts-scrollable">
|
||
<li
|
||
v-for="(item, index) in prefecture"
|
||
:key="index"
|
||
ref="chosebox"
|
||
@click="selectproduct(item, index)"
|
||
:class="item.checked ? 'active' : 'unactive'"
|
||
>
|
||
{{ item.tagName }}
|
||
</li>
|
||
</ol>
|
||
</div>
|
||
|
||
<div class="ts-scrollable-container" v-if="!inRxGoods">
|
||
<h2>年龄:</h2>
|
||
<ol class="ts-scrollable">
|
||
<li
|
||
v-for="(item, index) in catage"
|
||
:key="index"
|
||
@click="selectage(item, index)"
|
||
:class="item.checked ? 'active' : 'unactive'"
|
||
ref="chosebox1"
|
||
>
|
||
{{ item.tagName }}
|
||
</li>
|
||
</ol>
|
||
</div>
|
||
|
||
<div class="ts-scrollable-container" v-if="inRxGoods">
|
||
<h2>功能:</h2>
|
||
<ol class="ts-scrollable">
|
||
<li
|
||
v-for="(item, index) in rxFilters"
|
||
:key="index"
|
||
@click="selectFilter(item, index)"
|
||
:class="item.checked ? 'active' : 'unactive'"
|
||
>
|
||
{{ item.tagName }}
|
||
</li>
|
||
</ol>
|
||
</div>
|
||
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="online"></div>
|
||
<!-- rc-main start -->
|
||
<div class="rc-max-width--xl rc-margin-bottom--lg">
|
||
<div class="usersearch">
|
||
<div class="rc-contair">
|
||
<div class="ts-no-data" v-if="!rccontair.length">暂未发现相关记录</div>
|
||
<ul class="ts-product-list">
|
||
<li
|
||
v-for="(item, index) in rccontair"
|
||
:key="index"
|
||
class="rc-margin-top--md"
|
||
>
|
||
<div
|
||
class="rc-click rc-margin-bottom--md"
|
||
@click="selectproduce(item)"
|
||
>
|
||
<div class="rc-rccontair">
|
||
<img :src="item.picture" v-if="(item.picture && item.picture.length>0)" alt="" />
|
||
<img src="/images/default.jpg" v-if="(!item.picture || item.picture.length<=0)" alt="" />
|
||
</div>
|
||
</div>
|
||
<div class="rc-column">
|
||
<div class="rc-click" @click="selectproduce(item)">
|
||
<span>{{ item.name }}</span>
|
||
<i>{{ item.ecPrice?("￥"+item.ecPrice):'' }}</i>
|
||
</div>
|
||
<strong
|
||
class="
|
||
ts-standard-btn ts-standard-btn--two
|
||
rc-margin-y--md
|
||
center
|
||
"
|
||
@click="selectproduce(item)"
|
||
>立即购买</strong
|
||
>
|
||
</div>
|
||
</li>
|
||
</ul>
|
||
</div>
|
||
<div class="usershow" v-if="openshow">
|
||
<div class="rc-show"></div>
|
||
</div>
|
||
</div>
|
||
<div v-if="isadrond" class="useronshow">
|
||
<div class="rc-mubu" v-if="isshow" @click="usershow()"></div>
|
||
<div class="rc-bottom rc-full-width" v-if="isshow">
|
||
<div class="usersearch">
|
||
<div class="usercontentshow rc-column" ref="usercontent">
|
||
<div class="usercontentshow rc-product">
|
||
<div class="rc-productcat ts-scrollable">
|
||
<ol>
|
||
<li
|
||
v-for="(item, index) in userproduct"
|
||
:key="index"
|
||
@click="selectGoods(item, index)"
|
||
:class="activeIndex == index ? 'active' : 'unactive'"
|
||
class="ts-standard-btn"
|
||
ref="userstandard"
|
||
>
|
||
<img :src="item.catimage" alt="" />
|
||
<span>{{ item.title }}</span>
|
||
</li>
|
||
</ol>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="ts-scrollable-container">
|
||
<h2>专区:</h2>
|
||
<ol class="ts-scrollable">
|
||
<li
|
||
v-for="(item, index) in prefecture"
|
||
:key="index"
|
||
ref="chosebox"
|
||
@click="selectproduct(item, index)"
|
||
:class="item.checked ? 'active' : 'unactive'"
|
||
>
|
||
{{ item.tagName }}
|
||
</li>
|
||
</ol>
|
||
</div>
|
||
|
||
<div class="ts-scrollable-container" v-if="!inRxGoods">
|
||
<h2>年龄:</h2>
|
||
<ol class="ts-scrollable">
|
||
<li
|
||
v-for="(item, index) in catage"
|
||
:key="index"
|
||
@click="selectage(item, index)"
|
||
:class="item.checked ? 'active' : 'unactive'"
|
||
ref="chosebox1"
|
||
>
|
||
{{ item.tagName }}
|
||
</li>
|
||
</ol>
|
||
</div>
|
||
<div class="ts-scrollable-container" v-if="!inRxGoods">
|
||
<h2>功能:</h2>
|
||
<ol class="ts-scrollable">
|
||
<li
|
||
v-for="(item, index) in catagea"
|
||
ref="cgosebox4"
|
||
:key="index"
|
||
@click="selectagc(item, index)"
|
||
:class="item.checked ? 'active' : 'unactive'"
|
||
>
|
||
{{ item.tagName }}
|
||
</li>
|
||
</ol>
|
||
</div>
|
||
<div class="ts-scrollable-container" v-if="!inRxGoods">
|
||
<h2>品种:</h2>
|
||
<ol class="ts-scrollable">
|
||
<li
|
||
v-for="(item, index) in catageb"
|
||
:key="index"
|
||
@click="selectagd(item, index)"
|
||
:class="item.checked ? 'active' : 'unactive'"
|
||
ref="chosebox3"
|
||
>
|
||
{{ item.tagName }}
|
||
</li>
|
||
</ol>
|
||
</div>
|
||
|
||
<div class="ts-scrollable-container" v-if="inRxGoods">
|
||
<h2>功能:</h2>
|
||
<ol class="ts-scrollable">
|
||
<li
|
||
v-for="(item, index) in rxFilters"
|
||
:key="index"
|
||
@click="selectFilter(item, index)"
|
||
:class="item.checked ? 'active' : 'unactive'"
|
||
>
|
||
{{ item.tagName }}
|
||
</li>
|
||
</ol>
|
||
</div>
|
||
|
||
</div>
|
||
</div>
|
||
|
||
<div class="rc-button">
|
||
<span @click="openclose()">取消</span>
|
||
<em @click="openclose()">确认</em>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<el-dialog :visible.sync="dialogInfo1" hegight="700px" v-if="!isadrond">
|
||
<div class="usersearch">
|
||
<div class="usercontentshow" ref="usercontent">
|
||
<div class="usercontentshow rc-product">
|
||
<div class="rc-productcat ts-scrollable">
|
||
<ol>
|
||
<li
|
||
v-for="(item, index) in userproduct"
|
||
:key="index"
|
||
@click="selectGoods(item, index)"
|
||
:class="activeIndex == index ? 'active' : 'unactive'"
|
||
class="ts-standard-btn"
|
||
ref="userstandard"
|
||
>
|
||
<img :src="item.catimage" alt="" />
|
||
<span>{{ item.title }}</span>
|
||
</li>
|
||
</ol>
|
||
</div>
|
||
</div>
|
||
<div class="ts-scrollable-container">
|
||
<h2>专区:</h2>
|
||
<ol class="ts-scrollable">
|
||
<li
|
||
v-for="(item, index) in prefecture"
|
||
:key="index"
|
||
@click="selectproduct(item, index)"
|
||
:class="item.checked ? 'active' : 'unactive'"
|
||
>
|
||
{{ item.tagName }}
|
||
</li>
|
||
</ol>
|
||
</div>
|
||
|
||
<div class="ts-scrollable-container" v-if="!inRxGoods">
|
||
<h2>年龄:</h2>
|
||
<ol class="ts-scrollable">
|
||
<li
|
||
v-for="(item, index) in catage"
|
||
:key="index"
|
||
@click="selectage(item, index)"
|
||
:class="item.checked ? 'active' : 'unactive'"
|
||
ref="chosebox1"
|
||
>
|
||
{{ item.tagName }}
|
||
</li>
|
||
</ol>
|
||
</div>
|
||
<div class="ts-scrollable-container" v-if="!inRxGoods">
|
||
<h2>功能:</h2>
|
||
<ol class="ts-scrollable">
|
||
<li
|
||
v-for="(item, index) in catagea"
|
||
:key="index"
|
||
ref="cgosebox4"
|
||
@click="selectagc(item, index)"
|
||
:class="item.checked ? 'active' : 'unactive'"
|
||
>
|
||
{{ item.tagName }}
|
||
</li>
|
||
</ol>
|
||
</div>
|
||
<div class="ts-scrollable-container" v-if="!inRxGoods">
|
||
<h2>品种:</h2>
|
||
<ol class="ts-scrollable">
|
||
<li
|
||
v-for="(item, index) in catageb"
|
||
:key="index"
|
||
@click="selectagd(item, index)"
|
||
:class="item.checked ? 'active' : 'unactive'"
|
||
ref="chosebox3"
|
||
>
|
||
{{ item.tagName }}
|
||
</li>
|
||
</ol>
|
||
</div>
|
||
<div class="ts-scrollable-container" v-if="inRxGoods">
|
||
<h2>功能:</h2>
|
||
<ol class="ts-scrollable">
|
||
<li
|
||
v-for="(item, index) in rxFilters"
|
||
:key="index"
|
||
@click="selectFilter(item, index)"
|
||
:class="item.checked ? 'active' : 'unactive'"
|
||
>
|
||
{{ item.tagName }}
|
||
</li>
|
||
</ol>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<!--
|
||
<div class="rc-button rc-padding-bottom--md">
|
||
<span @click="openclose()">取消</span>
|
||
<em @click="openclose()">确认</em>
|
||
</div>
|
||
-->
|
||
</el-dialog>
|
||
</div>
|
||
<!-- rc-main end -->
|
||
<FixRight></FixRight>
|
||
<div v-if="isLoading" class="ts-mask">
|
||
<div class="ts-mask-bg"></div>
|
||
<div class="userloding"></div>
|
||
<span>数据加载中</span>
|
||
</div>
|
||
<MyFooter></MyFooter>
|
||
</div>
|
||
</template>
|
||
|
||
<script>
|
||
import Myheader from "~/components/header.vue";
|
||
import MyFooter from '~/components/rc-footer.vue'
|
||
import FixRight from "~/components/fixed-right.vue";
|
||
import tabs from "~/components/tabs.vue";
|
||
import { biaome, userstype, searchchanpin, userquery, userque } from "../../ajax/getData";
|
||
import envData from "~/config/env-data.js";
|
||
export default {
|
||
data() {
|
||
return {
|
||
value: "",
|
||
envData,
|
||
crumbs:[
|
||
{
|
||
path:'/usersearch/search/',
|
||
}
|
||
],
|
||
rxFilters:[],
|
||
isLoading: true,
|
||
userserachlist: [
|
||
{
|
||
categoryName: [], //专区
|
||
tagUsedAge: [], //年龄
|
||
tagFunction: [], //功能
|
||
tagBreed: [], //品种
|
||
},
|
||
],
|
||
userstype: [],
|
||
activeIndex: "0",
|
||
activeIndex1: 0,
|
||
activeIndexa: "-1",
|
||
// userpeolist:[
|
||
// {
|
||
// categoryName:'', //专区
|
||
// tagUsedAge:'',//年龄
|
||
// tagFunction:'',//功能
|
||
// tagBreed:'', //品种
|
||
// }
|
||
// ],
|
||
allsearch: false,
|
||
dialogInfo1: false,
|
||
activeIndexb: "-1",
|
||
activeIndexc: "-1",
|
||
activeIndexd: "-1",
|
||
activeIndexe: "-1",
|
||
activeIndexf: "-1",
|
||
inRxGoods:false,
|
||
isadrond: true,
|
||
isshow: false,
|
||
openshow: false,
|
||
direction: "btt",
|
||
searchdata: [
|
||
{
|
||
title: "猫罐头",
|
||
ordernum: "1",
|
||
},
|
||
|
||
{
|
||
title: "犬罐头",
|
||
ordernum: "2",
|
||
},
|
||
{
|
||
title: "布偶猫",
|
||
ordernum: "3",
|
||
},
|
||
{
|
||
title: "博美犬",
|
||
ordernum: "4",
|
||
},
|
||
],
|
||
|
||
userproduct: [
|
||
{
|
||
title: "猫产品",
|
||
ordernum: "1",
|
||
catimage: require("../../assets/image/rc-cat.png"),
|
||
},
|
||
|
||
{
|
||
title: "犬产品",
|
||
ordernum: "2",
|
||
catimage: require("../../assets/image/rc-dog.png"),
|
||
},
|
||
],
|
||
|
||
catproduct: [
|
||
{
|
||
title: "猫产品",
|
||
ordernum: "1",
|
||
catimage: require("../../assets/image/rc-cat.png"),
|
||
},
|
||
|
||
{
|
||
title: "犬产品",
|
||
ordernum: "2",
|
||
catimage: require("../../assets/image/rc-dog.png"),
|
||
},
|
||
],
|
||
extraPrefecture: [
|
||
{
|
||
tagName: "处方粮",
|
||
ordernum: "99",
|
||
catimage: require("../../assets/image/rc-dog.png"),
|
||
isRxGoods:1
|
||
},
|
||
],
|
||
prefecture: [
|
||
{
|
||
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",
|
||
catimage: require("../../assets/image/rc-dog.png"),
|
||
},
|
||
],
|
||
catage: [
|
||
{
|
||
title: "<4月龄",
|
||
ordernum: "1",
|
||
},
|
||
{
|
||
title: "4-12月龄",
|
||
ordernum: "2",
|
||
},
|
||
{
|
||
title: "1-7岁",
|
||
ordernum: "3",
|
||
},
|
||
{
|
||
title: ">7岁",
|
||
ordernum: "4",
|
||
},
|
||
],
|
||
catagea: [
|
||
{
|
||
title: "绝育呵护",
|
||
ordernum: "1",
|
||
},
|
||
{
|
||
title: "口腔呵护",
|
||
ordernum: "2",
|
||
},
|
||
{
|
||
title: "美毛呵护",
|
||
ordernum: "3",
|
||
},
|
||
{
|
||
title: "去毛球",
|
||
ordernum: "4",
|
||
},
|
||
],
|
||
catageb: [
|
||
{
|
||
title: "英短",
|
||
ordernum: "1",
|
||
},
|
||
{
|
||
title: "美短",
|
||
ordernum: "2",
|
||
},
|
||
{
|
||
title: "布偶",
|
||
ordernum: "3",
|
||
},
|
||
{
|
||
title: "暹罗",
|
||
ordernum: "4",
|
||
},
|
||
],
|
||
|
||
rccontair: [
|
||
{
|
||
title: "",
|
||
price: "",
|
||
ordernum: 1,
|
||
|
||
catimage: '',
|
||
},
|
||
],
|
||
usercatlist: [],
|
||
userdoglisgt: [],
|
||
};
|
||
},
|
||
components: {
|
||
Myheader,
|
||
MyFooter,
|
||
FixRight,
|
||
tabs
|
||
},
|
||
mounted() {
|
||
const { query } = this.$route;
|
||
this.activeIndex1 = query.type || 0;
|
||
this.activeIndex = query.type || 0;
|
||
this.value = query.content || '';
|
||
this.usetmessage();
|
||
this.userst();
|
||
//Handling RxGoods filter
|
||
let curEnv = process.env.NODE_ENV;
|
||
this.rxFilters = envData[curEnv].rxGoodsFilter;
|
||
//Handling RxGoods filter end
|
||
|
||
console.log();
|
||
|
||
},
|
||
methods: {
|
||
//换一批
|
||
userbatch() {
|
||
this.allsearch = !this.allsearch;
|
||
if (this.allsearch == false) {
|
||
this.searchdata = [
|
||
{
|
||
title: "法国斗牛犬",
|
||
ordernum: "7",
|
||
},
|
||
{
|
||
title: "老年",
|
||
ordernum: "8",
|
||
},
|
||
{
|
||
title: "布偶",
|
||
ordernum: "9",
|
||
},
|
||
{
|
||
title: "柴犬",
|
||
ordernum: "10",
|
||
},
|
||
];
|
||
this.activeIndexa = 0;
|
||
} else {
|
||
this.searchdata = [
|
||
{
|
||
title: "猫罐头",
|
||
ordernum: "1",
|
||
},
|
||
|
||
{
|
||
title: "犬罐头",
|
||
ordernum: "2",
|
||
},
|
||
{
|
||
title: "布偶猫",
|
||
ordernum: "3",
|
||
},
|
||
{
|
||
title: "博美犬",
|
||
ordernum: "4",
|
||
},
|
||
];
|
||
this.activeIndexa = 0;
|
||
}
|
||
},
|
||
|
||
async usersearch(stype, usertype) {
|
||
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, 120);
|
||
}
|
||
if (data) {
|
||
this.rccontair = data;
|
||
this.isLoading=false;
|
||
}
|
||
},
|
||
async getRxGoodsByFunc(functionName) {
|
||
this.isLoading = true;
|
||
let petType = this.activeIndex1;
|
||
let data = await userque(functionName, petType, 1, 20);
|
||
if (data) {
|
||
this.rccontair = data;
|
||
this.isLoading = false;
|
||
}
|
||
},
|
||
async userst() {
|
||
this.isLoading = true;
|
||
let pinzhong = [];
|
||
let zhuanqu = [];
|
||
let age = [];
|
||
let gonneg = [];
|
||
let data = await userstype();
|
||
if (data) {
|
||
this.userstype = data;
|
||
this.isLoading = false;
|
||
}
|
||
this.usercatlist = this.userstype.filter((item) => item.petType == "0");
|
||
this.usercatlist.map((element) => {
|
||
if (element.name == "品种") {
|
||
pinzhong.push(element);
|
||
this.catageb = pinzhong;
|
||
this.catageb=this.catageb.sort((n1,n2)=>{
|
||
return n1.sort-n2.sort;
|
||
})
|
||
this.catageb.forEach((element) => {
|
||
element.checked = false;
|
||
});
|
||
// console.log(this.catageb);
|
||
}
|
||
if (element.name == "功能") {
|
||
gonneg.push(element);
|
||
this.catagea = gonneg;
|
||
this.catagea.forEach((element) => {
|
||
element.checked = false;
|
||
});
|
||
console.log(this.catagea);
|
||
}
|
||
if (element.name == "年龄") {
|
||
age.push(element);
|
||
this.catage = age;
|
||
this.catage.forEach((element) => {
|
||
element.checked = false;
|
||
});
|
||
}
|
||
if (element.name == "专区") {
|
||
zhuanqu.push(element);
|
||
this.prefecture = zhuanqu;
|
||
this.prefecture.forEach((element) => {
|
||
element.checked = false;
|
||
});
|
||
}
|
||
});
|
||
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");
|
||
},
|
||
|
||
async usetmessage() {
|
||
this.isLoading = true;
|
||
this.$nextTick(() => {
|
||
this.$refs.userstandard[0].style.margin = 0 + "px";
|
||
});
|
||
console.log(this.activeIndex1, this.value,'this.activeIndex1, this.value');
|
||
let data = await biaome(this.activeIndex1, this.value, 1, 10);
|
||
if (data) {
|
||
this.rccontair = data;
|
||
this.isLoading = false;
|
||
}
|
||
this.userproduct.forEach((element) => {
|
||
element.checked = false;
|
||
});
|
||
},
|
||
selectproduce(item,index){
|
||
let isRxGoods=false;
|
||
let productCode = [];
|
||
let mainProductCode = item.productCode;
|
||
if(!item.ecPrice && !item.price)
|
||
{
|
||
isRxGoods=1;
|
||
productCode = [item.productCode];
|
||
} else {
|
||
for(let i of item.productList) {
|
||
productCode.push(i.productCode);
|
||
}
|
||
}
|
||
this.$router.push({
|
||
path: "/productdetails/producted",
|
||
query: {
|
||
stype: 1,
|
||
isRxGoods: isRxGoods,
|
||
mainProductCode:mainProductCode,
|
||
productCode:productCode.join(",")
|
||
},
|
||
});
|
||
},
|
||
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;
|
||
}
|
||
});
|
||
this.inRxGoods=true;
|
||
}
|
||
else {
|
||
this.prefecture[this.rxGoodsIndexPointer].checked=false;
|
||
this.inRxGoods=false;
|
||
}
|
||
},
|
||
selectFilter(item) {
|
||
for(let tmp of this.rxFilters) {
|
||
if(item.tagValue == tmp.tagValue) {
|
||
item.checked = !item.checked;
|
||
} else {
|
||
tmp.checked = false;
|
||
}
|
||
}
|
||
if(item.checked)
|
||
this.getRxGoodsByFunc(item.tagValue);
|
||
else
|
||
this.getRxGoodsByFunc();
|
||
},
|
||
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.checkRxGoods(false);
|
||
this.userserachlist = [
|
||
{
|
||
categoryName: [], //专区
|
||
tagUsedAge: [], //年龄
|
||
tagFunction: [], //功能
|
||
tagBreed: [], //品种
|
||
},
|
||
];
|
||
},
|
||
userbuy() {
|
||
this.$router.push({
|
||
path: "/myorder/userrecord",
|
||
query: {
|
||
stype: 1,
|
||
},
|
||
});
|
||
},
|
||
openclose() {
|
||
this.dialogInfo1 = false;
|
||
this.isshow = false;
|
||
},
|
||
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
|
||
)
|
||
) {
|
||
console.log("当前是电脑打开");
|
||
this.$nextTick(() => {
|
||
this.isadrond = false;
|
||
this.dialogInfo1 = true;
|
||
this.isadrond = false;
|
||
this.isshow = false;
|
||
});
|
||
} else {
|
||
console.log("当前是手机打开");
|
||
this.$nextTick(() => {
|
||
this.isadrond = true;
|
||
this.isshow = true;
|
||
// this.$refs.usercontent.style.display='none ';
|
||
this.dialogInfo1 = false;
|
||
});
|
||
}
|
||
},
|
||
//搜索
|
||
onSearch(e) {
|
||
this.usetmessage(this.activeIndex1, this.value);
|
||
},
|
||
onCancel(e) {
|
||
debugger;
|
||
this.value='';
|
||
},
|
||
selectGoods(item, index, onlyRefreshCategory) {
|
||
this.activeIndex1 = index;
|
||
this.resetAllOptions();
|
||
if(!onlyRefreshCategory)
|
||
this.usersearch(this.userserachlist, this.activeIndex1);
|
||
let pinzhong = [];
|
||
let zhuanqu = [];
|
||
let age = [];
|
||
let gonneg = [];
|
||
if (this.activeIndex1 == 0) {
|
||
this.usercatlist.map((element) => {
|
||
if (element.name == "品种") {
|
||
pinzhong.push(element);
|
||
|
||
this.catageb = pinzhong;
|
||
}
|
||
if (element.name == "功能") {
|
||
gonneg.push(element);
|
||
this.catagea = gonneg;
|
||
}
|
||
if (element.name == "年龄") {
|
||
age.push(element);
|
||
this.catage = age;
|
||
}
|
||
if (element.name == "专区") {
|
||
zhuanqu.push(element);
|
||
this.prefecture = zhuanqu;
|
||
}
|
||
});
|
||
} else if (this.activeIndex1 == 1) {
|
||
this.userdoglisgt.map((element) => {
|
||
if (element.name == "品种") {
|
||
pinzhong.push(element);
|
||
this.catageb = pinzhong;
|
||
this.catageb.forEach((element) => {
|
||
element.checked = false;
|
||
});
|
||
}
|
||
if (element.name == "功能") {
|
||
gonneg.push(element);
|
||
this.catagea = gonneg;
|
||
this.catagea.forEach((element) => {
|
||
element.checked = false;
|
||
});
|
||
}
|
||
if (element.name == "年龄") {
|
||
age.push(element);
|
||
this.catage = age;
|
||
this.catage.forEach((element) => {
|
||
element.checked = false;
|
||
});
|
||
}
|
||
if (element.name == "专区") {
|
||
zhuanqu.push(element);
|
||
this.prefecture = zhuanqu;
|
||
this.prefecture.forEach((element) => {
|
||
element.checked = false;
|
||
});
|
||
}
|
||
});
|
||
}
|
||
let _self = this;
|
||
this.extraPrefecture.forEach(function(ele){
|
||
_self.prefecture.push(ele);
|
||
_self.rxGoodsIndexPointer = _self.prefecture.length-1;
|
||
});
|
||
this.activeIndex = index;
|
||
},
|
||
selectGoodsa(item, index) {
|
||
let pinzhong = [];
|
||
let zhuanqu = [];
|
||
let age = [];
|
||
let gonneg = [];
|
||
this.activeIndex1 = index;
|
||
if (this.activeIndex1 == 0) {
|
||
this.usercatlist.map((element) => {
|
||
if (element.name == "品种") {
|
||
pinzhong.push(element);
|
||
this.catageb = pinzhong;
|
||
}
|
||
if (element.name == "功能") {
|
||
gonneg.push(element);
|
||
this.catagea = gonneg;
|
||
}
|
||
if (element.name == "年龄") {
|
||
age.push(element);
|
||
this.catage = age;
|
||
}
|
||
if (element.name == "专区") {
|
||
zhuanqu.push(element);
|
||
this.prefecture = gonneg;
|
||
}
|
||
});
|
||
} else if (this.activeIndex1 == 1) {
|
||
this.userdoglisgt.map((element) => {
|
||
if (element.name == "品种") {
|
||
pinzhong.push(element);
|
||
this.catageb = pinzhong;
|
||
}
|
||
if (element.name == "功能") {
|
||
gonneg.push(element);
|
||
this.catagea = gonneg;
|
||
}
|
||
if (element.name == "年龄") {
|
||
age.push(element);
|
||
this.catage = age;
|
||
}
|
||
if (element.name == "专区") {
|
||
zhuanqu.push(element);
|
||
this.prefecture = gonneg;
|
||
}
|
||
});
|
||
}
|
||
},
|
||
userselect() {
|
||
this.$nextTick(() => {
|
||
this.ifadroind();
|
||
});
|
||
},
|
||
usershow() {
|
||
this.$nextTick(() => {
|
||
this.isshow = false;
|
||
// dom元素更新后执行，因此这里能正确打印更改之后的值
|
||
// this.$refs.usercontent.style.display='block ';
|
||
});
|
||
},
|
||
|
||
selectsearch(item, index) {
|
||
this.value = item.title;
|
||
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;
|
||
}
|
||
// debugger;
|
||
// this.userishwo1 = !this.userishwo1;
|
||
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);
|
||
this.activeIndexc = index;
|
||
},
|
||
selectagc(item, index) {
|
||
this.checkRxGoods(false);
|
||
if(this.activeIndex=='-1'){
|
||
this.activeIndex=0;
|
||
}
|
||
/*
|
||
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 = "";
|
||
}
|
||
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;
|
||
}
|
||
let tagBreed = {};
|
||
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.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'){
|
||
this.activeIndex=0;
|
||
}
|
||
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 = "";
|
||
}
|
||
this.usersearch(this.userserachlist, this.activeIndex1);
|
||
*/
|
||
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
|
||
this.usersearch(this.userserachlist, this.activeIndex1);
|
||
},
|
||
|
||
//弹框的显示隐藏
|
||
},
|
||
};
|
||
</script>
|
||
|
||
<style lang="less" scoped >
|
||
@import url("../../assets/css/search.less");
|
||
</style> |