Commit b356a84f authored by 沈良进's avatar 沈良进

搜索页面优化

parent 07c0fc90
...@@ -526,7 +526,7 @@ export default { ...@@ -526,7 +526,7 @@ export default {
this.searchEndDate = newEndDateStr; this.searchEndDate = newEndDateStr;
// this.initAreas() // this.initAreas()
// this.initNavs(); // this.initNavs();
this.getCategoryList(); // this.getCategoryList();
}, },
methods: { methods: {
handleSelectArea(item) { handleSelectArea(item) {
......
...@@ -11,47 +11,6 @@ ...@@ -11,47 +11,6 @@
class="q-ma-md" class="q-ma-md"
@input="changeAddrSearchHandler" @input="changeAddrSearchHandler"
/> />
<!-- <template v-for="(x, i) in areaList">
<div class="addr" :key="i">
<div class="addr-list q-px-md q-py-sm cursor-pointer row items-center" v-if="x.isShow">
<q-checkbox
indeterminate-value="half"
@input="changeCheckHandler(x)"
v-model="x.checked"
size="xs"
/>
<span class="col" @click="changeExplesdHandler(x)">
{{
x.Name
}}
</span>
<q-icon
@click="changeExplesdHandler(x)"
v-if="
searchAdd.name.length == 0 ||
(searchAdd.name.length > 0 && x.isShowChild)
"
:name="!x.explsed ? 'keyboard_arrow_down' : 'keyboard_arrow_up'"
size="20px"
/>
</div>
<div
class="q-mx-md"
v-if="
x.explsed ||
(x.SubList && x.isShowChild && searchAdd.name.length > 0)
"
>
<template v-for="(y, yi) in x.SubList">
<div class="addr-list q-px-md q-py-sm row items-center" :key="yi" v-if="y.isShow">
<q-checkbox @input="changeCheckHandler(y, x)" v-model="y.checked" size="xs" />
<span class="col">{{ y.Name }}</span>
</div>
</template>
</div>
</div>
</template> -->
<q-tree <q-tree
ref="area" ref="area"
:nodes="areaList" :nodes="areaList"
...@@ -76,42 +35,6 @@ ...@@ -76,42 +35,6 @@
@update:ticked="handleTicked" @update:ticked="handleTicked"
:ticked="ticked" :ticked="ticked"
/> />
<!-- <div class="add q-mt-md" v-for="(x, i) in goodsType" :key="i">
<div class="addr-list q-px-md q-py-sm cursor-pointer row items-center">
<span class="col" @click="changeExplesdHandler(x)">
{{
x.CategoryName
}}
</span>
<q-icon
@click="changeExplesdHandler(x)"
:name="!x.explsed ? 'keyboard_arrow_down' : 'keyboard_arrow_up'"
size="20px"
/>
</div>
<div class="q-mx-md" v-if="x.explsed">
<div
v-for="(y, yi) in x.SubList"
:key="yi"
>
<div class="addr-list q-px-md q-py-sm row items-center">
<q-checkbox v-model="y.checked" size="xs" @input="changeGoodTypeHandler(y)" />
<span class="col">{{ y.CategoryName }}</span>
</div>
<div class="q-mx-md" v-if="y.explsed">
<div
class="addr-list q-px-md q-py-sm row items-center"
v-for="(z, zi) in y.SubList"
:key="zi"
>
<q-checkbox v-model="z.checked" size="xs" @input="changeGoodTypeHandler(z)" />
<span class="col">{{ z.CategoryName }}</span>
</div>
</div>
</div>
</div>
</div> -->
</q-card> </q-card>
<q-card flat class="rounded-borders q-mt-lg row no-padding"> <q-card flat class="rounded-borders q-mt-lg row no-padding">
...@@ -150,8 +73,8 @@ ...@@ -150,8 +73,8 @@
</div> </div>
<q-range <q-range
v-model="msg.priceRange" v-model="msg.priceRange"
:min="1" :min="priceModel.min"
:max="100000" :max="priceModel.max"
:step="1" :step="1"
@input="testHandler" @input="testHandler"
color="primary" color="primary"
...@@ -444,6 +367,10 @@ export default { ...@@ -444,6 +367,10 @@ export default {
], ],
TotalCount: 0, TotalCount: 0,
PageCount: 0, PageCount: 0,
priceModel: {
min: 1,
max: 100000,
}
}; };
}, },
created() { created() {
...@@ -473,6 +400,8 @@ export default { ...@@ -473,6 +400,8 @@ export default {
}, },
handleAreaTicked(target) { handleAreaTicked(target) {
this.areaTicked = target; this.areaTicked = target;
console.log('this.areaTicked', target)
this.msg.placeIds = this.getChoseAddressCity().join(",");
this.goSearchHandler(); this.goSearchHandler();
}, },
initAreaList() { initAreaList() {
...@@ -529,38 +458,21 @@ export default { ...@@ -529,38 +458,21 @@ export default {
this.msg.orderBy = x.value; this.msg.orderBy = x.value;
this.goSearchHandler(); this.goSearchHandler();
}, },
changeCheckHandler(x, p = null) {
if (p) {
let t = p.SubList.filter((x) => x.checked);
p.checked =
t.length == p.SubList.length ? true : t.length == 0 ? false : "half";
this.changeChosenHandler(x);
} else {
x.SubList.forEach((item) => {
item.checked = x.checked;
this.changeChosenHandler(item);
});
}
},
changeChosenHandler(x) {
let i = this.chosenAddress.findIndex((item) => item.Id == x.Id) ?? -1;
if (!x.checked) {
if (i > -1) {
this.chosenAddress.splice(i, 1);
}
} else {
if (i == -1) {
this.chosenAddress.push(x);
}
}
this.msg.placeIds = this.getChoseAddressCity().join(",");
this.goSearchHandler();
},
getChoseAddressCity() { getChoseAddressCity() {
let result = []; let result = [];
this.chosenAddress.forEach((item) => { function treeToArray(tree) {
return tree.reduce((res, item) => {
const { children, ...i } = item
return res.concat(i, children && children.length ? treeToArray(children) : [])
}, [])
}
const areaList = treeToArray(this.areaList)
console.log('>>>>>>>>>>>>>>>>>>>>>', areaList)
areaList.forEach((item) => {
if(this.areaTicked.includes(item.Id)) {
let arr = item.DestinationList.map((item) => item.ID); let arr = item.DestinationList.map((item) => item.ID);
result = result.concat(arr); result = result.concat(arr);
}
}); });
return result; return result;
}, },
...@@ -623,7 +535,7 @@ export default { ...@@ -623,7 +535,7 @@ export default {
if (y.Id === this.msg.categoryId) { if (y.Id === this.msg.categoryId) {
arr.push(y.Id); arr.push(y.Id);
} }
if (y.SubList) { if (y.SubList && y.SubList.length) {
y.children = y.SubList; y.children = y.SubList;
y.children.forEach((z) => { y.children.forEach((z) => {
z.checked = false; z.checked = false;
...@@ -640,6 +552,7 @@ export default { ...@@ -640,6 +552,7 @@ export default {
}); });
this.goodsType.push(x); this.goodsType.push(x);
}); });
this.goodsTypeJSON = JSON.stringify(this.goodsType)
if (this.msg.categoryId) { if (this.msg.categoryId) {
this.$nextTick(() => { this.$nextTick(() => {
this.$refs.category.setTicked([...new Set(arr)], true); this.$refs.category.setTicked([...new Set(arr)], true);
...@@ -648,7 +561,7 @@ export default { ...@@ -648,7 +561,7 @@ export default {
}, },
dfs (tree, ope, filter) { dfs (tree, ope, filter) {
const walkAndCopy = (tree, depth = 1) => { const walkAndCopy = (tree, depth = 1) => {
if(filter(tree.Name)) { if(filter(tree)) {
const copy = {...tree} const copy = {...tree}
ope(tree.Name, depth) ope(tree.Name, depth)
if(tree.children) { if(tree.children) {
...@@ -659,7 +572,7 @@ export default { ...@@ -659,7 +572,7 @@ export default {
}) })
} }
return copy return copy
} else if(tree.children && tree.children.length) { } else if(tree && tree.children && tree.children.length) {
const copy = {...tree} const copy = {...tree}
ope(tree.Name, depth) ope(tree.Name, depth)
copy.Name = tree.Name copy.Name = tree.Name
...@@ -677,9 +590,9 @@ export default { ...@@ -677,9 +590,9 @@ export default {
}, },
changeAddrSearchHandler(v) { changeAddrSearchHandler(v) {
this.areaListJSONTMP = JSON.parse(JSON.stringify(this.areaListJSON)); this.areaListJSONTMP = JSON.parse(JSON.stringify(this.areaListJSON));
let tree = this.dfs({Name: '', children: this.areaListJSONTMP}, (name, depth) => {}, (name) => {return name.indexOf(v) !== -1}) let tree = this.dfs({Name: '', children: this.areaListJSONTMP}, (name, depth) => {}, ({Name}) => {return Name.indexOf(v) !== -1})
tree = this.dfs(tree, (name, depth) => {}, (name) => {return name.indexOf(v) !== -1}) tree = this.dfs(tree, (name, depth) => {}, ({Name}) => {return Name.indexOf(v) !== -1})
tree = this.dfs(tree, (name, depth) => {}, (name) => {return name.indexOf(v) !== -1}) tree = this.dfs(tree, (name, depth) => {}, ({Name}) => {return Name.indexOf(v) !== -1})
this.areaList = tree.children this.areaList = tree.children
// this.areaList.forEach(x => { // this.areaList.forEach(x => {
// x.isShow = x.Name.indexOf(v) != -1; // x.isShow = x.Name.indexOf(v) != -1;
...@@ -695,7 +608,7 @@ export default { ...@@ -695,7 +608,7 @@ export default {
}, },
goSearchHandler() { goSearchHandler() {
this.msg.webSiteCategoryIds = this.ticked.join(","); this.msg.webSiteCategoryIds = this.ticked.join(",");
this.msg.placeIds = this.areaTicked.join(","); // this.msg.placeIds = this.areaTicked.join(",");
this.$q.loading.show(); this.$q.loading.show();
this.DataList = []; this.DataList = [];
let minTripDay = -1, let minTripDay = -1,
...@@ -766,8 +679,20 @@ let areaInfo = condition.find(item => item.type === 1).list ...@@ -766,8 +679,20 @@ let areaInfo = condition.find(item => item.type === 1).list
let dayInfo = condition.find(item => item.type === 2).list let dayInfo = condition.find(item => item.type === 2).list
let priceInfo = condition.find(item => item.type === 3) let priceInfo = condition.find(item => item.type === 3)
let categoryInfo = condition.find(item => item.type === 4).list let categoryInfo = condition.find(item => item.type === 4).list
this.areaTicked = areaInfo; // this.areaTicked = areaInfo;
this.ticked = categoryInfo; this.areaListJSONTMP = JSON.parse(JSON.stringify(this.areaListJSON));
let tree = this.dfs({Name: '', children: this.areaListJSONTMP}, (name, depth) => {}, ({Id}) => {return areaInfo.includes(Id)})
tree = this.dfs(tree, (name, depth) => {}, ({Id}) => {return areaInfo.includes(Id)})
tree = this.dfs(tree, (name, depth) => {}, ({Id}) => {return areaInfo.includes(Id)})
this.areaList = tree.children
const categoryTmp = JSON.parse(this.goodsTypeJSON);
let category = this.dfs({Name: '', children: categoryTmp}, (name, depth) => {}, (item) => {return categoryInfo.includes(item.Id)})
category = this.dfs(category, (name, depth) => {}, (item) => {return categoryInfo.includes(item.Id)})
category = this.dfs(category, (name, depth) => {}, (item) => {return categoryInfo.includes(item.Id)})
this.goodsType = category.children
// this.ticked = categoryInfo;
console.log('this.areaListJSONTMP', this.areaListJSONTMP, this.areaList)
this.priceModel = {min: priceInfo.minPrice, max: priceInfo.maxPrice}
this.msg.priceRange = {min: priceInfo.minPrice, max: priceInfo.maxPrice} this.msg.priceRange = {min: priceInfo.minPrice, max: priceInfo.maxPrice}
let arr = [] let arr = []
dayInfo.forEach(item => { dayInfo.forEach(item => {
...@@ -783,12 +708,13 @@ dayInfo.forEach(item => { ...@@ -783,12 +708,13 @@ dayInfo.forEach(item => {
}) })
console.log('dayInfo', arr, dayInfo, this.dayArray) console.log('dayInfo', arr, dayInfo, this.dayArray)
// arr = [... new Set(arr)] // arr = [... new Set(arr)]
this.dayArray.forEach(item => { // this.dayArray.forEach(item => {
if(arr.includes(item.id)) { // if(arr.includes(item.id)) {
item.checked = true // item.checked = true
} // }
}) // })
this.msg.dayNumList = arr; this.dayArray = this.dayArray.filter(item => arr.includes(item.id))
// this.msg.dayNumList = arr;
}, },
GotoDetails(item) { GotoDetails(item) {
if(item.productType === 4) { // 接送机,包车 if(item.productType === 4) { // 接送机,包车
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment