Skip to content

M
million
Commit 0b5a6f33 authored by 沈良进's avatar 沈良进
Browse files
Options

首页优化

parent 2c11f5f3
Expand all Hide whitespace changes
Inline Side-by-side
Showing with 1392 additions and 212 deletions
src/components/navs/city-category-mobile.vue 0 → 100644
View file @ 0b5a6f33
This diff is collapsed.
src/components/navs/city-category.vue 0 → 100644
View file @ 0b5a6f33
This diff is collapsed.
src/components/navs/hor-big-one.vue
View file @ 0b5a6f33
......@@ -178,6 +178,7 @@
class="zk_toolbar flex justify-between"
:class="{ 'q-px-none': $q.platform.is.desktop }"
>
<div v-if="$q.platform.is.mobile" @click="showDialog = true">菜单</div>
<img
:src="baseData.logo"
style="
......@@ -283,227 +284,34 @@
<!-- 移动端 -->
<div v-else>
<img
class="avatar"
@click="avatarClick"
class="avatar q-mt-sm"
v-if="LoginUser.photo"
:src="LoginUser.photo"
/>
<img
v-else
class="avatar q-mt-sm"
@click="avatarClick"
src="../../assets/img/avatar.png"
/>
</div>
</q-toolbar>
<q-separator color="grey-2" v-if="isHome" />
<div class="header-box flex q-py-sm" v-if="isHome">
<q-tabs align="center" shrink>
<q-btn
flat
class="address-btn"
@mouseenter="mouseenterAddress"
@mouseleave="mouseeleaveAddress"
>
<span slot="default" class="flex item-center">
<i
class="iconfont icondingweixiao q-icon notranslate"
style="font-size: 14px; margin-right: 8px"
></i
>選擇目的地
</span>
<q-menu
ref="address"
@mouseenter="addressMenuEnter"
class="light-shadow"
>
<div class="address-box flex">
<div class="menu-box">
<div
v-for="item in areas"
:key="item.Id"
class="menu-item"
@click="changeAreas(item)"
:class="{ select: selectedAreaId === item.Id }"
>
<div v-if="!item.tag" class="hot">{{ item.Name }}</div>
<div v-else>
<div class="menu-title">{{ item.Name }}</div>
<div class="menu-tag-box">
<span>加德滿都</span>
<span>加德滿都</span>
</div>
</div>
</div>
</div>
<!-- 热门城市 -->
<div class="col bg-grey-2">
<div v-if="!selectedAreaId" class="row q-pr-md">
<div
@click="handleSelectArea(item)"
v-for="item in selectedArea"
class="q-mt-md q-ml-md"
:key="item.Id"
style="width: 130px; height: 70px"
>
<q-img
:src="item.ImageList[0]"
spinner-color="grey-2"
class="rounded-borders full-width full-height"
>
<div
class="full-width full-height row items-center justify-center"
style="background: none"
>
<div
style="
background: rgba(0, 0, 0, 0.2);
text-shadow: 2px 2px 5px rgb(0 0 0 / 50%);
"
class="rounded-borders q-px-md q-py-xs text-white cursor-pointer"
>
{{ item.Name }}
</div>
</div>
</q-img>
</div>
</div>
<div v-else class="city-box">
<div class="row" v-for="item in selectedArea" :key="item.Id">
<div style="width: 138px">
<div
@click="handleSelectArea(item)"
class="q-py-xs q-px-md bg-grey-4 cursor-pointer text-black text-subtitle2 inline-block rounded-borders text-weight-bolder"
>
{{ item.Name }}
</div>
</div>
<div class="col q-mt-sm">
<div class="row q-col-gutter-lg">
<div
@click="handleSelectArea(item2)"
class="text-subtitle2 text-grey-9 cursor-pointer"
v-for="item2 in item.SubList"
:key="item2.Id"
>
{{ item2.Name }}
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</q-menu>
</q-btn>
<q-separator style="height: 16px; margin: auto 0" vertical />
<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">
<div
class="category-item font-16"
:key="i"
v-for="(x, i) in dataList.CategoryList"
>
{{ x.CategoryName }}
</div>
</div>
<q-separator />
<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="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>
</div>
</div>
</div>
</q-menu>
</q-btn>
<template v-for="(x, i) in dataList.CategoryList">
<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">
<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>
</div>
</q-menu>
</q-btn>
</template>
</q-tabs>
</div>
<city-category v-if="$q.platform.is.desktop" :baseData="baseData" :dataList="dataList"></city-category>
<q-dialog v-model="showDialog">
<city-category-mobile></city-category-mobile></q-dialog>
</q-header>
</template>
<script>
import CityCategoryMobile from './city-category-mobile.vue';
import cityCategory from "./city-category.vue";
export default {
components: { cityCategory, CityCategoryMobile },
props: {
baseData: {
type: Object,
default: {},
default: () => ({}),
},
dataList: {
type: Object,
......@@ -516,6 +324,7 @@ export default {
},
data() {
return {
showDialog: false,
searchDate: "",
searchEndDate: "",
menuFocusAll: 0,
......@@ -590,7 +399,7 @@ export default {
},
methods: {
avatarClick() {
if (this.LoginUser.token && 1=== 2) {
if (this.LoginUser.token) {
this.CommonJump("/userCenter");
} else {
// 展示登录弹窗
......
src/pages/city/cityDetail.vue
View file @ 0b5a6f33
......@@ -345,7 +345,7 @@ export default {
this.CommonJump(
"/search",
{
qsearchKey: this.detail.AreaName,
areaId: this.detail.Id,
qsearchDate: this.searchDate,
qsearchEndDate: this.searchEndDate,
CategoryName: item.title}
......
src/pages/city/components/near-city.vue
View file @ 0b5a6f33
......@@ -44,7 +44,7 @@
<div class="row no-wrap">
<div
@click="navToSearch(item)"
class="relative card"
class="relative card cursor-pointer"
v-for="item in cityList"
:key="item.Id"
>
......@@ -96,7 +96,7 @@ export default {
qsearchEndDate: this.searchEndDate,
};
if (item) {
params.qsearchKey = item.AreaName
params.areaId = item.Id
}
this.CommonJump("/search", params);
},
......
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