Commit 8d7211d9 authored by 沈良进's avatar 沈良进

首页及搜索页调整

parent fa260c12
......@@ -122,7 +122,7 @@ margin-left: 10px;
height: 34px;
border-radius: 8px;
line-height: 34px;
padding-left: 8px;
padding:0 8px;
cursor: pointer;
}
.category-l2-select {
......@@ -243,7 +243,7 @@ color: #EE4454;
</q-menu>
</q-btn>
<q-btn label="帮助中心" flat></q-btn>
<q-btn label="注册" flat></q-btn>
<q-btn v-if="LoginUser.accountId <= 0" label="注册" flat></q-btn>
<template v-if="LoginUser.accountId > 0">
<q-btn-dropdown
style="color: #444; font-weight: bold"
......@@ -344,15 +344,15 @@ color: #EE4454;
</div>
<div class="city-box">
<div v-for="item in selectedArea" :key="item.Id">
<div class="city" >
<div @click="handleSelectArea(item)" class="city" >
<img class="city-img" v-if="item.ImageList.length" :src="item.ImageList[0]" />
<div class="city-name-box flex flex-center"><div class="city-name">{{item.Name}}</div></div>
</div>
<template v-if="item.SubList">
<div class="city" v-for="item2 in item.SubList" :key="item2.Id">
<div @click="handleSelectArea(item2)" class="city" v-for="item2 in item.SubList" :key="item2.Id">
<div>
<img class="city-img" v-if="item2.ImageList.length" :src="item2.ImageList[0]" />
<div class="city-name-box flex flex-center"><div class="city-name">{{item.Name}}</div></div>
<div class="city-name-box flex flex-center"><div class="city-name">{{item2.Name}}</div></div>
</div>
</div>
</template>
......@@ -363,7 +363,7 @@ color: #EE4454;
</q-btn>
<q-separator style="height: 16px;margin: auto 0" vertical/>
<q-btn class="all-type" flat label="全部分類" @mouseenter="typeHoverAll(true)" @mouseleave="typeHoverAll(false)">
<q-menu ref="menu0" @mouseenter="menuFocus = 2" @mouseleave="menuLeaveAll">
<q-menu ref="menu0" @mouseenter="menuFocusAll = 2" @mouseleave="menuLeaveAll">
<div class="all-menu">
<div class="flex">
<div class="category-item font-16" :key="i" v-for="(x, i) in dataList.CategoryList">{{x.CategoryName}}</div>
......@@ -372,9 +372,9 @@ color: #EE4454;
<div class="flex">
<div class="category-item" :key="i" v-for="(x, i) in dataList.CategoryList">
<div :key="item.Id" v-for="item in x.SubList">
<div @click="selectCategory = item.Id" class="category-l2" :class="{'category-l2-select': selectCategory === item.Id}">{{item.CategoryName}}</div>
<div @click="handleCategoryChage(item)" class="category-l2" :class="{'category-l2-select': selectCategory === item.Id}">{{item.CategoryName}}</div>
<div v-if="item.SubList.length">
<div @click="selectCategory = item2.Id"
<div @click="handleCategoryChage(item2)"
class="category-l3"
:class="{'category-l3-select': selectCategory === item2.Id}"
:key="item2.Id"
......@@ -391,26 +391,19 @@ color: #EE4454;
<template v-for="(x, i) in dataList.CategoryList">
<q-btn :key="i" :label="x.CategoryName" flat :content-style="{ hover: '#ff0000' }" @mouseenter="typeHover(i,true)" @mouseleave="typeHover(i,false)">
<q-menu ref="menu" :key="i" @mouseenter="menuFocus = 2" @mouseleave="menuLeave(i)">
<q-list>
<div :key="item.Id" v-for="item in x.SubList">
<q-item v-if="item.SubList.length" clickable>
<q-item-section>{{item.CategoryName}}</q-item-section>
<q-item-section side>
<q-icon name="keyboard_arrow_right" />
</q-item-section>
<q-menu anchor="top right" self="top left">
<q-list>
<q-item :key="item2.Id" v-for="item2 in item.SubList" clickable v-close-popup>
<q-item-section>{{item2.CategoryName}}</q-item-section>
</q-item>
</q-list>
</q-menu>
</q-item>
<q-item v-else clickable v-close-popup>
<q-item-section>{{item.CategoryName}}</q-item-section>
</q-item>
</div>
</q-list>
<div :key="item.Id" v-for="item in x.SubList">
<div @click="handleCategoryChage(item)" class="category-l2" :class="{'category-l2-select': selectCategory === item.Id}">{{item.CategoryName}}</div>
<div v-if="item.SubList.length">
<div @click="handleCategoryChage(item2)"
class="category-l3"
:class="{'category-l3-select': selectCategory === item2.Id}"
:key="item2.Id"
v-for="item2 in item.SubList"
>
<div>{{item2.CategoryName}}</div>
</div>
</div>
</div>
</q-menu>
</q-btn>
</template>
......@@ -437,6 +430,9 @@ export default {
},
data() {
return {
searchDate: "",
searchEndDate: "",
menuFocusAll: 0,
menuFocus: 0,
selectCategory: undefined,
categoryList: [],
......@@ -473,11 +469,41 @@ export default {
if (localStorage.b2bUser) {
this.LoginUser = JSON.parse(window.localStorage.getItem("b2bUser"));
}
var newStartDate = new Date();
var newStartDateStr = this.formatDate(
newStartDate.getFullYear(),
newStartDate.getMonth() + 1,
newStartDate.getDate()
);
var newEndDate = this.AddMonth(newStartDateStr, 2);
var newEndDateStr = this.formatDate(
newEndDate.getFullYear(),
newEndDate.getMonth() + 1,
newEndDate.getDate()
);
this.searchDate = newStartDateStr;
this.searchEndDate = newEndDateStr;
// this.initAreas()
// this.initNavs();
this.getCategoryList();
},
methods: {
handleSelectArea(item) {
this.CommonJump("/search", {
qsearchKey: this.searchKey,
qsearchDate: this.searchDate,
qsearchEndDate: this.searchEndDate,
areaId: item.Id
});
},
handleCategoryChage(item) {
this.CommonJump("/search", {
qsearchKey: this.searchKey,
qsearchDate: this.searchDate,
qsearchEndDate: this.searchEndDate,
categoryId: item.Id
});
},
mouseenterAddress() {
this.menuFocusAll = 0
this.menuFocus = 0
......@@ -543,7 +569,7 @@ export default {
menuLeaveAll() {
this.menuFocus = 0
setTimeout(() => {
if(!this.menuFocus) {
if(!this.menuFocusAll) {
this.$refs.menu0.hide()
}
}, 50)
......
......@@ -179,7 +179,7 @@
<div class="text-weight-bold q-pa-sm">熱門目的地</div>
<q-separator />
<div>
<div class="hot-tag" @click="setectHotTag = item.Id" :class="{'hot-tag-select': setectHotTag === item.Id}" :key="item" v-for="item in hotList">{{item.Name}}</div>
<div class="hot-tag" @click="handleHotTagClick(item)" :class="{'hot-tag-select': setectHotTag === item.Id}" :key="item" v-for="item in hotList">{{item.Name}}</div>
</div>
<!-- <div class="col full-width row">
<div style="width: 180px">
......@@ -498,6 +498,20 @@ export default {
},
computed: {},
methods: {
handleHotTagClick(item) {
this.setectHotTag = item.Id
let val = item.Name
if(val!='' && typeof val == 'string'){
this.searchKey=val
}
this.historys=Array.from(new Set([this.searchKey].concat(this.historys)))
localStorage['recent_search'] = JSON.stringify(this.historys)
this.CommonJump("/search", {
qsearchKey: this.searchKey,
qsearchDate: this.searchDate,
qsearchEndDate: this.searchEndDate,
});
},
//获取地区数据
getAera() {
this.apipost(
......
......@@ -55,15 +55,14 @@
<q-card flat class="rounded-borders q-py-md q-mt-lg">
<div class="text-subtitle1 text-weight-bold q-mx-md">所有商品類別</div>
<q-tree
ref="category"
:nodes="goodsType"
no-connectors
node-key="Id"
label-key="CategoryName"
tick-strategy="leaf"
@update:ticked="handleTicked"
@update:selected="handleSelected"
:selected.sync="selected"
:ticked.sync="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">
......@@ -196,10 +195,10 @@
:icon="x.icon"
class="cursor-pointer"
clickable
:text-color="sortNum != x.value ? 'dark' : 'white'"
:text-color="msg.orderBy != x.value ? 'dark' : 'white'"
:class="{
'bg-grey-3': sortNum != x.value,
'bg-primary': sortNum == x.value,
'bg-grey-3': msg.orderBy != x.value,
'bg-primary': msg.orderBy == x.value,
}"
v-for="(x, i) in sortArray"
:key="i"
......@@ -215,7 +214,7 @@
:key="i"
>
<q-img
:src="x.newCoverImg"
:src="x.imgCover"
:ratio="1"
spinner-color="grey"
spinner-size="20px"
......@@ -232,7 +231,7 @@
class="f12 rounded-borders text-secondary"
label="急速確認"
/>
<q-chip
<q-chip v-if="x.ltName"
style="background: #26a69a1a"
size="sm"
class="f12 rounded-borders text-secondary"
......@@ -260,7 +259,7 @@
<span>行程天數:</span>
<span class="text-secondary text-weight-bold">{{ x.dayNum }} 天</span>
</div>
<div class="text-h6 product-price">CNY:{{ x.b2CPrice }}</div>
<div class="text-h6 product-price">CNY:{{ x.b2CPrice }}<span class="price-stuff"></span></div>
</div>
</div>
</div>
......@@ -294,7 +293,7 @@ export default {
props: ["qMsg"],
data() {
return {
ticked: [],
ticked: [5],
selected: [],
searchAdd: {
name: "",
......@@ -362,21 +361,20 @@ export default {
}
],
dataList: [],
sortNum: 1,
sortArray: [
{
label: "強力推薦",
value: 1,
label: "默认排序",
value: 0,
icon: "iconfont icongood"
},
{
label: "價格:低到高",
value: 2,
value: 1,
icon: "iconfont iconmeiyuan"
},
{
label: "價格:高到低",
value: 3,
value: 2,
icon: "iconfont iconmeiyuan"
}
],
......@@ -406,7 +404,9 @@ export default {
console.log("handleSelected", target);
},
handleTicked(target) {
console.log("handleTicked", target);
console.log("handleTicked", target, this.ticked);
this.ticked = target
this.goSearchHandler();
},
initAreaList() {
let jObj = JSON.parse(window.localStorage.getItem("baseifo"));
......@@ -415,16 +415,32 @@ export default {
y.checked = false;
y.explsed = false;
y.isShow = true;
if(y.Id === this.msg.areaId) {
y.checked = true
this.chosenAddress.push(y);
this.changeCheckHandler(y)
this.msg.placeIds = this.getChoseAddressCity().join(',');
}
if (y.SubList) {
y.SubList.forEach(z => {
z.checked = false;
z.explsed = false;
z.isShow = true;
if(z.Id === this.msg.areaId) {
z.checked = true
this.chosenAddress.push(z);
this.msg.placeIds = this.getChoseAddressCity().join(',');
this.changeCheckHandler(z,y)
}
if(y.Id === this.msg.areaId) {
z.checked = true
}
});
}
});
this.areaList.push(...x.SubList);
});
console.log("this.areaList", this.areaList, this.msg)
},
changeExplesdHandler(x) {
x.explsed = !x.explsed;
......@@ -440,10 +456,8 @@ export default {
// }
// },
chosenSortHandler(x) {
this.sortNum = x.value;
this.msg.orderByDate = this.sortNum == 4 ? 1 : this.sortNum == 5 ? 2 : 0;
this.msg.orderByPrice = this.sortNum == 2 ? 1 : this.sortNum == 3 ? 2 : 0;
this.msg.orderByDay = this.sortNum == 6 ? 1 : this.sortNum == 7 ? 2 : 0;
this.msg.orderBy = x.value;
this.goSearchHandler();
},
changeCheckHandler(x, p = null) {
if (p) {
......@@ -469,7 +483,7 @@ export default {
this.chosenAddress.push(x);
}
}
this.msg.placeIds = this.getChoseAddressCity();
this.msg.placeIds = this.getChoseAddressCity().join(',');
this.goSearchHandler();
},
getChoseAddressCity() {
......@@ -505,6 +519,7 @@ export default {
}
})
this.msg.dayNumList = arr
this.goSearchHandler();
},
optionsFn(cd) {
return (
......@@ -516,14 +531,17 @@ export default {
this.$forceUpdate();
this.msg.minPrice = e.min;
this.msg.maxPrice = e.max;
this.goSearchHandler();
},
dateRangeHandler(e) {
console.log('dateRangeHandler', e)
this.msg.startDate = `${e.from.year}/${e.from.month}/${e.from.day}`;
this.msg.endDate = `${e.to.year}/${e.to.month}/${e.to.day} `;
this.$refs.qDateProxy.hide();
this.goSearchHandler();
},
initGoods() {
let arr = []
let jObj = JSON.parse(window.localStorage.getItem("baseifo"));
jObj.CategoryList.forEach(x => {
x.checked = false;
......@@ -534,18 +552,33 @@ export default {
y.checked = false;
y.explsed = false;
y.isShow = true;
if(y.Id === this.msg.categoryId) {
arr.push(y.Id)
}
if (y.SubList) {
y.children = y.SubList
y.children.forEach(z => {
z.checked = false;
z.explsed = false;
z.isShow = true;
if(z.Id === this.msg.categoryId) {
arr.push(y.Id)
arr.push(z.Id)
}
if(y.Id === this.msg.categoryId) {
arr.push(z.Id)
}
});
}
});
this.goodsType.push(x);
console.log('this.goodsType', this.goodsType)
console.log('this.goodsType', this.goodsType, this.ticked, arr)
});
if(this.msg.categoryId) {
this.$nextTick(() => {
this.$refs.category.setTicked([...new Set(arr)], true)
})
}
},
changeAddrSearchHandler(v) {
this.areaList.forEach(x => {
......@@ -561,7 +594,7 @@ export default {
});
},
goSearchHandler() {
this.msg.webSiteCategoryIds = this.ticked
this.msg.webSiteCategoryIds = this.ticked.join(',')
this.$q.loading.show();
this.DataList = [];
let minTripDay = -1,
......@@ -599,18 +632,18 @@ export default {
this.TotalCount = res.data.data.count;
var tempArray = res.data.data.pageData;
if (tempArray && tempArray.length > 0) {
tempArray.forEach(item => {
if (item.imgCover && item.imgCover != "") {
try {
var imgArray = JSON.parse(item.imgCover);
if (imgArray && imgArray.length > 0) {
item.newCoverImg = imgArray[0].Url;
} else {
item.newCoverImg = "";
}
} catch (e) {}
}
});
// tempArray.forEach(item => {
// if (item.imgCover && item.imgCover != "") {
// try {
// var imgArray = JSON.parse(item.imgCover);
// if (imgArray && imgArray.length > 0) {
// item.newCoverImg = imgArray[0].Url;
// } else {
// item.newCoverImg = "";
// }
// } catch (e) {}
// }
// });
this.DataList = tempArray;
this.$forceUpdate();
}
......@@ -634,3 +667,9 @@ export default {
background: #f1416c1a;
}
</style>
<style scoped>
.price-stuff {
font-size: 12px;
margin-left: 4px;
}
</style>
......@@ -1172,6 +1172,8 @@
},
//查询参数
qMsg: {
pageIndex: 1,
pageSize: 20,
companyId: 0,
startDate: "", //开始日期
endDate: "", //结束日期
......@@ -1217,6 +1219,8 @@
var qsearchKey = this.getUrlKey("qsearchKey", window.location.href);
var qsearchDate = this.getUrlKey("qsearchDate", window.location.href);
var qsearchEndDate = this.getUrlKey("qsearchEndDate", window.location.href);
var areaId = this.getUrlKey("areaId", window.location.href);
var categoryId = this.getUrlKey("categoryId", window.location.href);
if (qsearchKey) {
this.qMsg.searchKey = qsearchKey;
}
......@@ -1226,6 +1230,12 @@
if (qsearchEndDate) {
this.qMsg.endDate = qsearchEndDate;
}
if (areaId) {
this.qMsg.areaId = Number(areaId);
}
if (categoryId) {
this.qMsg.categoryId = Number(categoryId);
}
if ((qsearchKey || qsearchDate || qsearchEndDate) && this.ShowType!=2) {
this.goSearchHandler();
......
......@@ -1236,10 +1236,10 @@
babel-plugin-dynamic-import-node "^2.3.0"
babel-plugin-module-resolver "^4.0.0"
"@quasar/extras@^1.0.0":
version "1.8.2"
resolved "https://registry.npmmirror.com/@quasar/extras/-/extras-1.8.2.tgz"
integrity sha512-y3A4OO4DGDxuFyh/X4k5fS17TTxhpPauZv8Qr/0bso+RTk5f+3X4lLAcP7aaiqcBLOV8HsUKpGzNArMleClYgg==
"@quasar/extras@^1.15.10":
version "1.15.11"
resolved "https://registry.yarnpkg.com/@quasar/extras/-/extras-1.15.11.tgz#a54d60b14446b850a1e5fccab3f381a2e447a73f"
integrity sha512-EEXL10EJQmL9jNs5fp0Kd/nyonG8hTODolj+qpYNPG3qEEoy3txr05Pdmp9qJYaXIzP9rOS9FGhFe9Mnq6MBBg==
"@quasar/fastclick@1.1.4":
version "1.1.4"
......@@ -2114,6 +2114,11 @@ babel-plugin-transform-object-rest-spread@^6.26.0:
babel-plugin-syntax-object-rest-spread "^6.8.0"
babel-runtime "^6.26.0"
babel-plugin-transform-remove-console@^6.9.4:
version "6.9.4"
resolved "https://registry.yarnpkg.com/babel-plugin-transform-remove-console/-/babel-plugin-transform-remove-console-6.9.4.tgz#b980360c067384e24b357a588d807d3c83527780"
integrity sha512-88blrUrMX3SPiGkT1GnvVY8E/7A+k6oj3MNvUtTIxJflFzXTw1bHkuJ/y039ouhFMp2prRn5cQGzokViYi1dsg==
babel-runtime@^6.26.0:
version "6.26.0"
resolved "https://registry.npmmirror.com/babel-runtime/-/babel-runtime-6.26.0.tgz"
......@@ -7622,10 +7627,10 @@ qs@~6.5.2:
resolved "https://registry.npmmirror.com/qs/-/qs-6.5.3.tgz"
integrity sha512-qxXIEh4pCGfHICj1mAJQ2/2XVZkjCDTcEgfoSQxc/fYivUZxTkk7L3bDBJSoNrEzXI17oUO5Dp07ktqE5KzczA==
quasar@^1.0.0:
version "1.12.5"
resolved "https://registry.npmmirror.com/quasar/-/quasar-1.12.5.tgz"
integrity sha512-pZUE0v98Zo0n7jepF77GZq8wuM7AQlZhjhiofzAX7ROePxbAD/bdvfmm2KJhVqOKW0ipMAvmihB7rt5dm03lMA==
quasar@^1.22.5:
version "1.22.5"
resolved "https://registry.yarnpkg.com/quasar/-/quasar-1.22.5.tgz#7c33a02a5541b62b057f1d805b64cbcb59243152"
integrity sha512-cb/Q1Nvx1Lo3i2Gq+7j6kN/DJzZrTPG6JJKus3WJ0YpqsiovoWchnbDrGkTyL8nCnj2Im4SAX50DF0Vbd6pK3w==
query-string@^4.1.0:
version "4.3.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