Skip to content

M
million
Commit 20cc4ce9 authored by 沈良进's avatar 沈良进
Browse files
Options

首页样式优化，跳转搜索页优化

parent 42d66461
Expand all Hide whitespace changes
Inline Side-by-side
Showing with 1456 additions and 1145 deletions
src/components/navs/hor-big-one.vue
View file @ 20cc4ce9
......@@ -69,27 +69,48 @@
}
.city-box {
padding: 14px 18px;
width: 641px;
width: 641px;background: #F5F5F5;
}
.city {
width: 129px;
height: 69px;
background: #ee4454;
border-radius: 10px;
margin: 11px;
border: 1px solid #eee;
display: inline-block;
position: relative;
cursor: pointer;
}
.city2 {
width: 76px;
height: 32px;
background: #DBDBDB;
border-radius: 8px;
font-weight: bold;
line-height: 32px;
overflow: hidden;
padding: 0 8px;
margin-right: 20px;
cursor: pointer;
}
.city3 {
height: 32px;
line-height: 32px;
/* display: inline-block; */
margin: 0 10px 18px 0;
cursor: pointer;
font-weight: bold;
}
.city:hover {
background-color: #eeeeee;
}
.city-img {
width: 129px;
height: 69px;
width: 127px;
height: 67px;
position: absolute;
top: 0;
left: 0;
top: 1;
left: 1;
border-radius: 10px;
}
.city-name-box {
z-index: 10;
......@@ -114,22 +135,23 @@
margin-left: 10px;
}
.all-menu {
width: 820px;
width: 660px;
padding: 10px;
}
.category-item {
width: 200px;
width: 160px;
padding: 10px;
border-radius: 8px;
font-weight: bold;
}
.font-16 {
font-size: 16px;
}
.category-l2 {
padding: 8px;
height: 34px;
/* border-radius: 8px; */
line-height: 18px;
/* padding:0 8px; */
border-radius: 8px;
line-height: 34px;
padding:0 8px;
cursor: pointer;
}
.category-l2:hover {
......@@ -141,10 +163,10 @@ color: #fff;
}
.category-l3 {
padding: 8px;
font-size: 14px;
font-size: 12px;
font-weight: 400;
color: #A0A0A0;
/* padding-left: 8px; */
border-radius: 8px;
cursor: pointer;
}
.category-l3:hover {
......@@ -153,6 +175,14 @@ cursor: pointer;
.category-l3-select {
color: #EE4454;
}
.category-box {
width: 140px;
padding:10px;
font-weight: bold;
}
.category-btn {
width: 100px;
}
</style>
<template>
<q-header
......@@ -355,7 +385,8 @@ color: #EE4454;
</div>
</div>
</div>
<div class="city-box">
<!-- 热门城市 -->
<div v-if="!selectedAreaId" class="city-box">
<div v-for="item in selectedArea" :key="item.Id">
<div @click="handleSelectArea(item)" class="city" >
<img class="city-img" v-if="item.ImageList.length" :src="item.ImageList[0]" />
......@@ -371,11 +402,24 @@ color: #EE4454;
</template>
</div>
</div>
<div v-else class="city-box">
<div class="flex" v-for="item in selectedArea" :key="item.Id">
<div @click="handleSelectArea(item)" class="city2" >
{{item.Name}}
</div>
<div class="flex flex-wrap">
<div @click="handleSelectArea(item2)" class="city3" v-for="item2 in item.SubList" :key="item2.Id">{{item2.Name}}</div>
</div>
</div>
</div>
</div>
</q-menu>
</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-btn class="all-type category-btn" flat label="全部分類" @mouseenter="typeHoverAll(true)" @mouseleave="typeHoverAll(false)">
<q-menu ref="menu0" @mouseenter="menuFocusAll = 2" @mouseleave="menuLeaveAll">
<div class="all-menu">
<div class="flex">
......@@ -402,8 +446,9 @@ color: #EE4454;
</q-menu>
</q-btn>
<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-btn class="category-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)">
<div class="category-box">
<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">
......@@ -416,7 +461,7 @@ color: #EE4454;
<div>{{item2.CategoryName}}</div>
</div>
</div>
</div>
</div></div>
</q-menu>
</q-btn>
</template>
......
src/components/search_sf/search_sf2.vue
View file @ 20cc4ce9
......@@ -517,16 +517,17 @@ export default {
},
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)
// 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,
areaId: item.Id
});
},
//获取地区数据
......@@ -761,6 +762,7 @@ line-height: 34px;
padding-left: 8px;
border-radius: 8px;
margin: 12px 0 12px 12px;
cursor: pointer;
}
.hot-tag-select {
background: #EE4454;
......
src/components/searchdata/kkday.vue
View file @ 20cc4ce9
......@@ -11,7 +11,7 @@
class="q-ma-md"
@input="changeAddrSearchHandler"
/>
<template v-for="(x, i) in areaList">
<!-- <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
......@@ -50,7 +50,18 @@
</template>
</div>
</div>
</template>
</template> -->
<q-tree
ref="area"
:nodes="areaList"
no-connectors
node-key="Id"
label-key="Name"
tick-strategy="leaf"
@update:ticked="handleAreaTicked"
:ticked="areaTicked"
/>
</q-card>
<q-card flat class="rounded-borders q-py-md q-mt-lg">
<div class="text-subtitle1 text-weight-bold q-mx-md">所有商品類別</div>
......@@ -112,8 +123,8 @@
<div class="row items-center justify-center col">
<span class="text-grey-8">
{{
dateRange.from
? `${dateRange.from} - ${dateRange.to}`
msg.startDate
? `${msg.startDate} - ${msg.endDate}`
: "篩選出發日期"
}}
</span>
......@@ -251,11 +262,11 @@
</div>
<div class="row items-end">
<div class="col f12">
<span>剩餘空位：</span>
<!-- <span>剩餘空位：</span>
<span
class="text-primary text-weight-bold q-pr-sm q-mr-sm"
style="border-right: 1px solid #efefef"
>{{ x.surplus }}</span>
>{{ x.surplus }}</span> -->
<span>行程天數：</span>
<span class="text-secondary text-weight-bold">{{ x.dayNum }} 天</span>
</div>
......@@ -279,6 +290,9 @@
active-design="unelevated"
unelevated
glossy
ellipses
:max-pages="6"
boundary-numbers
size="13px"
padding="sm md"
></q-pagination>
......@@ -293,6 +307,7 @@ export default {
props: ["qMsg"],
data() {
return {
areaTicked: [],
ticked: [],
selected: [],
searchAdd: {
......@@ -408,39 +423,47 @@ export default {
this.ticked = target
this.goSearchHandler();
},
handleAreaTicked(target) {
console.log("handleAreaTicked", target, this.areaTicked);
this.areaTicked = target
this.goSearchHandler();
},
initAreaList() {
let jObj = JSON.parse(window.localStorage.getItem("baseifo"));
let arr = []
jObj.AreaList.forEach(x => {
x.SubList.forEach(y => {
x.children = x.SubList
x.children.forEach(y => {
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(',');
arr.push(y.Id)
}
if (y.SubList) {
y.SubList.forEach(z => {
y.children = y.SubList
y.children.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)
arr.push(z.Id)
}
if(y.Id === this.msg.areaId) {
z.checked = true
arr.push(z.Id)
}
});
}
});
this.areaList.push(...x.SubList);
this.areaList = jObj.AreaList;
});
console.log("this.areaList", this.areaList, this.msg)
if(this.msg.areaId) {
this.$nextTick(() => {
this.$refs.area.setTicked([...new Set(arr)], true)
})
}
},
changeExplesdHandler(x) {
x.explsed = !x.explsed;
......@@ -562,7 +585,6 @@ export default {
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) {
......@@ -595,7 +617,7 @@ export default {
},
goSearchHandler() {
this.msg.webSiteCategoryIds = this.ticked.join(',')
this.$q.loading.show();
// this.$q.loading.show();
this.DataList = [];
let minTripDay = -1,
maxTripDay = -1,
......@@ -622,6 +644,8 @@ export default {
this.msg.priceOrderByField = 2;
}
}
this.PageCount = 0
this.TotalCount = 0
this.apipost(
"b2c_get_GetB2CMergeProductPageList",
this.msg,
......
src/pages/Search.vue
View file @ 20cc4ce9
This diff is collapsed.
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