Skip to content

M
million
Commit 54333f83 authored by 沈良进's avatar 沈良进
Browse files
Options

底部,顶部导航优化

parent af342763
Hide whitespace changes
Inline Side-by-side
Showing with 323 additions and 256 deletions
src/components/navs/hor-big-one.vue
View file @ 54333f83
...@@ -47,7 +47,8 @@ ...@@ -47,7 +47,8 @@
} }
.city-box { .city-box {
padding: 14px 18px; padding: 14px 18px;
width: 641px;background: #F5F5F5; width: 641px;
background: #f5f5f5;
} }
.city { .city {
width: 129px; width: 129px;
...@@ -59,23 +60,23 @@ ...@@ -59,23 +60,23 @@
} }
.city2 { .city2 {
width: 76px; width: 76px;
height: 32px; height: 32px;
background: #DBDBDB; background: #dbdbdb;
border-radius: 8px; border-radius: 8px;
font-weight: bold; font-weight: bold;
line-height: 32px; line-height: 32px;
overflow: hidden; overflow: hidden;
padding: 0 8px; padding: 0 8px;
margin-right: 20px; margin-right: 20px;
cursor: pointer; cursor: pointer;
} }
.city3 { .city3 {
height: 32px; height: 32px;
line-height: 32px; line-height: 32px;
/* display: inline-block; */ /* display: inline-block; */
margin: 0 20px 4px 0; margin: 0 20px 4px 0;
cursor: pointer; cursor: pointer;
font-weight: bold; font-weight: bold;
} }
.city:hover { .city:hover {
background-color: #eeeeee; background-color: #eeeeee;
...@@ -99,7 +100,7 @@ font-weight: bold; ...@@ -99,7 +100,7 @@ font-weight: bold;
.city-name { .city-name {
text-align: center; text-align: center;
height: 22px; height: 22px;
background: rgba(0,0,0,0.2); background: rgba(0, 0, 0, 0.2);
color: #fff; color: #fff;
padding: 0 5px; padding: 0 5px;
border-radius: 10px; border-radius: 10px;
...@@ -108,7 +109,7 @@ font-weight: bold; ...@@ -108,7 +109,7 @@ font-weight: bold;
margin: 0 10px 0 44px; margin: 0 10px 0 44px;
} }
.all-type { .all-type {
margin-left: 10px; margin-left: 10px;
} }
.all-menu { .all-menu {
width: 660px; width: 660px;
...@@ -125,38 +126,38 @@ margin-left: 10px; ...@@ -125,38 +126,38 @@ margin-left: 10px;
font-size: 16px; font-size: 16px;
} }
.category-l2 { .category-l2 {
height: 34px; height: 34px;
border-radius: 8px; border-radius: 8px;
line-height: 34px; line-height: 34px;
padding:0 8px; padding: 0 8px;
cursor: pointer; cursor: pointer;
font-size:14px; font-size: 14px;
font-weight: 400; font-weight: 400;
} }
.category-l2:hover { .category-l2:hover {
background-color: #eee; background-color: #eee;
} }
.category-l2-select { .category-l2-select {
background: #EE4454; background: #ee4454;
color: #fff; color: #fff;
} }
.category-l3 { .category-l3 {
padding: 8px; padding: 8px;
font-size: 12px; font-size: 12px;
font-weight: 400; font-weight: 400;
color: #A0A0A0; color: #a0a0a0;
border-radius: 8px; border-radius: 8px;
cursor: pointer; cursor: pointer;
} }
.category-l3:hover { .category-l3:hover {
background-color: #eee; background-color: #eee;
} }
.category-l3-select { .category-l3-select {
color: #EE4454; color: #ee4454;
} }
.category-box { .category-box {
width: 140px; width: 140px;
padding:10px; padding: 10px;
font-weight: bold; font-weight: bold;
} }
.category-btn { .category-btn {
...@@ -170,7 +171,7 @@ color: #EE4454; ...@@ -170,7 +171,7 @@ color: #EE4454;
class="bg-white" class="bg-white"
height-hint="108" height-hint="108"
to="/index" to="/index"
style="border-bottom:1px solid #eee;" style="border-bottom: 1px solid #eee"
> >
<q-toolbar <q-toolbar
style="height: 50px; max-width: 1200px; margin: 0 auto" style="height: 50px; max-width: 1200px; margin: 0 auto"
...@@ -188,73 +189,8 @@ color: #EE4454; ...@@ -188,73 +189,8 @@ color: #EE4454;
class="q-mr-lg q-ml-sm" class="q-mr-lg q-ml-sm"
@click="CommonJump('/index', {})" @click="CommonJump('/index', {})"
/> />
<!-- <q-tabs <!-- pc -->
align="center" <div v-if="$q.platform.is.desktop">
style="margin: 0 auto"
shrink
v-if="!$q.screen.xs && navsStyle == 1"
>
<template v-for="(x, i) in navs">
<q-btn
:key="i"
stretch
flat
:label="x.title"
type="a"
:href="x.url"
target="_blank"
:no-wrap="true"
size="16px"
:content-style="{ hover: '#ff0000' }"
/>
</template>
</q-tabs>
<div
class="col row justify-center full-height"
v-if="!$q.screen.xs && navsStyle == 2"
>
<div
class="full-height text-middle q-px-lg cursor-pointer nav-items"
v-for="(x, i) in navs"
:key="i"
>
<a :href="x.url" style="color: inherit;text-decoration: none;">{{ x.title }}</a>
<div class="secondMenu bg-tansparent">
<div class="bg-white rounded-borders q-pa-sm light-shadow " style="min-width:200px;">
<q-list dense>
<q-item clickable v-ripple v-for="(y,yi) in x.childs" :key="yi" class="text-middle rounded-borders text-dark text-no-wrap">
<a :href="y.url" style="color:inherit; text-decoration: none;">{{ y.title }}</a>
</q-item>
</q-list>
</div>
</div>
</div>
</div>
<q-btn
flat
dense
round
icon="menu"
aria-label="Menu"
v-if="$q.screen.xs"
style="margin-left: auto"
>
<q-menu>
<q-tabs align="left" vertical shrink>
<template v-for="(x, i) in baseData.nav.navs">
<q-btn
style="display: block"
:key="i"
stretch
flat
:label="x.title"
@click="OpenNewUrl(x.url)"
/>
</template>
</q-tabs>
</q-menu>
</q-btn>-->
<div>
<q-btn label="繁體中文" flat> <q-btn label="繁體中文" flat>
<q-menu> <q-menu>
<q-list> <q-list>
...@@ -272,11 +208,15 @@ color: #EE4454; ...@@ -272,11 +208,15 @@ color: #EE4454;
class="q-ml-lg" class="q-ml-lg"
unelevated unelevated
> >
<template v-slot:label> <template v-slot:label>
<img class="avatar" v-if="LoginUser.photo" :src="LoginUser.photo" /> <img
<img class="avatar" v-else src="../../assets/img/avatar.png" /> class="avatar"
<!-- <span>{{LoginUser.name || LoginUser.mailbox}}</span> --> v-if="LoginUser.photo"
</template> :src="LoginUser.photo"
/>
<img class="avatar" v-else src="../../assets/img/avatar.png" />
<!-- <span>{{LoginUser.name || LoginUser.mailbox}}</span> -->
</template>
<div class="row no-wrap q-pa-md"> <div class="row no-wrap q-pa-md">
<div class="column"> <div class="column">
<q-list> <q-list>
...@@ -340,15 +280,36 @@ color: #EE4454; ...@@ -340,15 +280,36 @@ color: #EE4454;
/> />
</template> </template>
</div> </div>
<!-- 移动端 -->
<div v-else>
<img
class="avatar"
@click="avatarClick"
src="../../assets/img/avatar.png"
/>
</div>
</q-toolbar> </q-toolbar>
<q-separator color="grey-2" v-if="isHome"/> <q-separator color="grey-2" v-if="isHome" />
<div class="header-box flex q-py-sm" v-if="isHome"> <div class="header-box flex q-py-sm" v-if="isHome">
<q-tabs align="center" shrink> <q-tabs align="center" shrink>
<q-btn flat class="address-btn" @mouseenter="mouseenterAddress" @mouseleave="mouseeleaveAddress"> <q-btn
flat
class="address-btn"
@mouseenter="mouseenterAddress"
@mouseleave="mouseeleaveAddress"
>
<span slot="default" class="flex item-center"> <span slot="default" class="flex item-center">
<i class="iconfont icondingweixiao q-icon notranslate" style="font-size: 14px; margin-right: 8px"></i>選擇目的地 <i
class="iconfont icondingweixiao q-icon notranslate"
style="font-size: 14px; margin-right: 8px"
></i
>選擇目的地
</span> </span>
<q-menu ref="address" @mouseenter="addressMenuEnter" class="light-shadow"> <q-menu
ref="address"
@mouseenter="addressMenuEnter"
class="light-shadow"
>
<div class="address-box flex"> <div class="address-box flex">
<div class="menu-box"> <div class="menu-box">
<div <div
...@@ -356,11 +317,11 @@ color: #EE4454; ...@@ -356,11 +317,11 @@ color: #EE4454;
:key="item.Id" :key="item.Id"
class="menu-item" class="menu-item"
@click="changeAreas(item)" @click="changeAreas(item)"
:class="{'select': selectedAreaId === item.Id}" :class="{ select: selectedAreaId === item.Id }"
> >
<div v-if="!item.tag" class="hot">{{item.Name}}</div> <div v-if="!item.tag" class="hot">{{ item.Name }}</div>
<div v-else> <div v-else>
<div class="menu-title">{{item.Name}}</div> <div class="menu-title">{{ item.Name }}</div>
<div class="menu-tag-box"> <div class="menu-tag-box">
<span>加德滿都</span> <span>加德滿都</span>
<span>加德滿都</span> <span>加德滿都</span>
...@@ -371,77 +332,164 @@ color: #EE4454; ...@@ -371,77 +332,164 @@ color: #EE4454;
<!-- 热门城市 --> <!-- 热门城市 -->
<div class="col bg-grey-2"> <div class="col bg-grey-2">
<div v-if="!selectedAreaId" class="row q-pr-md"> <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;"> <div
<q-img :src="item.ImageList[0]" spinner-color="grey-2" class="rounded-borders full-width full-height"> @click="handleSelectArea(item)"
<div class="full-width full-height row items-center justify-center" style="background:none;"> v-for="item in selectedArea"
<div style="background:rgba(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> 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> </div>
</q-img> </q-img>
</div> </div>
</div> </div>
<div v-else class="city-box"> <div v-else class="city-box">
<div class="row" v-for="item in selectedArea" :key="item.Id"> <div class="row" v-for="item in selectedArea" :key="item.Id">
<div style="width:138px;"> <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" > <div
{{item.Name}} @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>
</div>
<div class="col q-mt-sm"> <div class="col q-mt-sm">
<div class="row q-col-gutter-lg"> <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
@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> </div>
</div> </div>
</div> </div>
</div>
</q-menu> </q-menu>
</q-btn> </q-btn>
<q-separator style="height: 16px;margin: auto 0" vertical/> <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-btn
<q-menu ref="menu0" @mouseenter="menuFocusAll = 2" @mouseleave="menuLeaveAll"> 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="all-menu">
<div class="flex"> <div class="flex">
<div class="category-item font-16" :key="i" v-for="(x, i) in dataList.CategoryList">{{x.CategoryName}}</div> <div
</div> class="category-item font-16"
<q-separator /> :key="i"
<div class="flex"> v-for="(x, i) in dataList.CategoryList"
<div class="category-item" :key="i" v-for="(x, i) in dataList.CategoryList"> >
<div :key="item.Id" v-for="item in x.SubList"> {{ x.CategoryName }}
<div @click="handleCategoryChage(item)" class="category-l2" :class="{'category-l2-select': selectCategory === item.Id}">{{item.CategoryName}}</div> </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 v-if="item.SubList.length">
<div @click="handleCategoryChage(item2)" <div
class="category-l3" @click="handleCategoryChage(item2)"
:class="{'category-l3-select': selectCategory === item2.Id}" class="category-l3"
:key="item2.Id" :class="{
v-for="item2 in item.SubList" 'category-l3-select': selectCategory === item2.Id,
> }"
<div>{{item2.CategoryName}}</div> :key="item2.Id"
</div> v-for="item2 in item.SubList"
>
<div>{{ item2.CategoryName }}</div>
</div>
</div> </div>
</div> </div>
</div>
</div> </div>
</div></div> </div>
</q-menu> </q-menu>
</q-btn> </q-btn>
<template v-for="(x, i) in dataList.CategoryList"> <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-btn
<q-menu ref="menu" :key="i" @mouseenter="menuFocus = 2" @mouseleave="menuLeave(i)"> 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 class="category-box">
<div :key="item.Id" v-for="item in x.SubList"> <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
<div v-if="item.SubList.length"> @click="handleCategoryChage(item)"
<div @click="handleCategoryChage(item2)" class="category-l2"
class="category-l3" :class="{
:class="{'category-l3-select': selectCategory === item2.Id}" 'category-l2-select': selectCategory === item.Id,
:key="item2.Id" }"
v-for="item2 in item.SubList" >
> {{ item.CategoryName }}
<div>{{item2.CategoryName}}</div> </div>
</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>
</div>
</q-menu> </q-menu>
</q-btn> </q-btn>
</template> </template>
...@@ -455,16 +503,16 @@ export default { ...@@ -455,16 +503,16 @@ export default {
props: { props: {
baseData: { baseData: {
type: Object, type: Object,
default: {} default: {},
}, },
dataList: { dataList: {
type: Object, type: Object,
default: {} default: {},
}, },
title: { title: {
type: String, type: String,
default: "" default: "",
} },
}, },
data() { data() {
return { return {
...@@ -480,12 +528,12 @@ export default { ...@@ -480,12 +528,12 @@ export default {
navsStyle: 1, navsStyle: 1,
areas: [], areas: [],
selectedArea: [], selectedArea: [],
selectedAreaId: '', selectedAreaId: "",
isHome:false isHome: false,
}; };
}, },
watch: { watch: {
title: function(val, oldval) { title: function (val, oldval) {
this.subTitle = val; this.subTitle = val;
}, },
baseData: { baseData: {
...@@ -493,27 +541,32 @@ export default { ...@@ -493,27 +541,32 @@ export default {
// this.initNavs(); // this.initNavs();
this.initAreas(); this.initAreas();
}, },
deep: true deep: true,
}, },
$route: { $route: {
handler: function(val, oldVal){ handler: function (val, oldVal) {
this.isHome = val.path==='/' || val.path==='/index' this.isHome = val.path === "/" || val.path === "/index";
}, },
// 深度观察监听 // 深度观察监听
deep: true deep: true,
} },
}, },
meta() { meta() {
return { return {
title: title:
this.subTitle != "" this.subTitle != ""
? `${this.subTitle} - ${this.baseData.name}` ? `${this.subTitle} - ${this.baseData.name}`
: this.baseData.name : this.baseData.name,
}; };
}, },
mounted() { mounted() {
this.isHome = this.$router.history.current.path==='/' || this.$router.history.current.path==='/index' this.isHome =
console.log('JSON.parse(window.localStorage.getItem("b2bUser"))', JSON.parse(window.localStorage.getItem("b2bUser"))) this.$router.history.current.path === "/" ||
this.$router.history.current.path === "/index";
console.log(
'JSON.parse(window.localStorage.getItem("b2bUser"))',
JSON.parse(window.localStorage.getItem("b2bUser"))
);
if (localStorage.b2bUser) { if (localStorage.b2bUser) {
this.LoginUser = JSON.parse(window.localStorage.getItem("b2bUser")); this.LoginUser = JSON.parse(window.localStorage.getItem("b2bUser"));
} }
...@@ -536,9 +589,17 @@ export default { ...@@ -536,9 +589,17 @@ export default {
// this.getCategoryList(); // this.getCategoryList();
}, },
methods: { methods: {
avatarClick() {
if (this.LoginUser.token && 1=== 2) {
this.CommonJump("/userCenter");
} else {
// 展示登录弹窗
this.CommonJump("/login");
}
},
handleSelectArea(item) { handleSelectArea(item) {
this.CommonJump("/city/" + item.Id, { this.CommonJump("/city/" + item.Id, {
id: item.Id id: item.Id,
}); });
}, },
handleCategoryChage(item) { handleCategoryChage(item) {
...@@ -546,86 +607,86 @@ export default { ...@@ -546,86 +607,86 @@ export default {
qsearchKey: this.searchKey, qsearchKey: this.searchKey,
qsearchDate: this.searchDate, qsearchDate: this.searchDate,
qsearchEndDate: this.searchEndDate, qsearchEndDate: this.searchEndDate,
categoryId: item.Id categoryId: item.Id,
}); });
}, },
mouseenterAddress() { mouseenterAddress() {
this.menuFocusAll = 0 this.menuFocusAll = 0;
this.menuFocus = 0 this.menuFocus = 0;
this.addressFocus = 1 this.addressFocus = 1;
this.$refs.address.show() this.$refs.address.show();
}, },
mouseeleaveAddress() { mouseeleaveAddress() {
setTimeout(() => { setTimeout(() => {
if(!this.addressFocus) { if (!this.addressFocus) {
this.$refs.address.hide() this.$refs.address.hide();
} }
}, 50) }, 50);
}, },
addressMenuEnter() { addressMenuEnter() {
this.addressFocus = 2 this.addressFocus = 2;
}, },
addressMenuLeave() { addressMenuLeave() {
this.addressFocus = 0 this.addressFocus = 0;
setTimeout(() => { setTimeout(() => {
if(!this.addressFocus) { if (!this.addressFocus) {
this.$refs.address.hide() this.$refs.address.hide();
} }
}, 50) }, 50);
}, },
typeHoverAll(bool) { typeHoverAll(bool) {
if(bool) { if (bool) {
this.addressFocus = 0 this.addressFocus = 0;
this.menuFocus = 0 this.menuFocus = 0;
this.menuFocusAll = 1 this.menuFocusAll = 1;
if(this.currentMenu !== undefined) { if (this.currentMenu !== undefined) {
this.$refs.menu[this.currentMenu].hide() this.$refs.menu[this.currentMenu].hide();
} }
this.$refs.menu0.show() this.$refs.menu0.show();
} else { } else {
this.menuFocusAll = 0 this.menuFocusAll = 0;
setTimeout(() => { setTimeout(() => {
if(!this.menuFocusAll) { if (!this.menuFocusAll) {
this.$refs.menu0.hide() this.$refs.menu0.hide();
} }
}, 50) }, 50);
} }
this.currentMenu = undefined this.currentMenu = undefined;
}, },
typeHover(index, bool) { typeHover(index, bool) {
if(bool) { if (bool) {
this.addressFocus = 0 this.addressFocus = 0;
this.menuFocusAll = 0 this.menuFocusAll = 0;
this.menuFocus = 1 this.menuFocus = 1;
if(this.currentMenu !== undefined && index !== this.currentMenu) { if (this.currentMenu !== undefined && index !== this.currentMenu) {
this.$refs.menu[this.currentMenu].hide() this.$refs.menu[this.currentMenu].hide();
} }
this.$refs.menu[index].show() this.$refs.menu[index].show();
} else { } else {
this.menuFocus = 0 this.menuFocus = 0;
setTimeout(() => { setTimeout(() => {
if(!this.menuFocus) { if (!this.menuFocus) {
this.$refs.menu[index].hide() this.$refs.menu[index].hide();
} }
}, 50) }, 50);
} }
this.currentMenu = index this.currentMenu = index;
}, },
menuLeaveAll() { menuLeaveAll() {
this.menuFocus = 0 this.menuFocus = 0;
setTimeout(() => { setTimeout(() => {
if(!this.menuFocusAll) { if (!this.menuFocusAll) {
this.$refs.menu0.hide() this.$refs.menu0.hide();
} }
}, 50) }, 50);
}, },
menuLeave(i) { menuLeave(i) {
this.menuFocus = 0 this.menuFocus = 0;
setTimeout(() => { setTimeout(() => {
if(!this.menuFocus) { if (!this.menuFocus) {
this.$refs.menu[i].hide() this.$refs.menu[i].hide();
} }
}, 50) }, 50);
}, },
changeAreas(item) { changeAreas(item) {
this.selectedArea = item.SubList; this.selectedArea = item.SubList;
...@@ -634,17 +695,17 @@ export default { ...@@ -634,17 +695,17 @@ export default {
initNavs() { initNavs() {
this.navs = []; this.navs = [];
if (this.baseData.nav.navs) { if (this.baseData.nav.navs) {
this.baseData.nav.navs.forEach(x => { this.baseData.nav.navs.forEach((x) => {
if (x.title.indexOf("^") != -1) { if (x.title.indexOf("^") != -1) {
console.log("in...."); console.log("in....");
let t = x.title.split("^"); let t = x.title.split("^");
let c = t[1].split(","); let c = t[1].split(",");
x.childs = []; x.childs = [];
c.forEach(y => { c.forEach((y) => {
let yt = y.split("&"); let yt = y.split("&");
x.childs.push({ x.childs.push({
title: yt[0], title: yt[0],
url: x.url + "&" + yt[1] url: x.url + "&" + yt[1],
}); });
}); });
x.title = t[0]; x.title = t[0];
...@@ -653,7 +714,7 @@ export default { ...@@ -653,7 +714,7 @@ export default {
}); });
} }
this.navsStyle = this.navs.findIndex(x => x.childs) != -1 ? 2 : 1; this.navsStyle = this.navs.findIndex((x) => x.childs) != -1 ? 2 : 1;
}, },
initAreas() { initAreas() {
this.areas = []; this.areas = [];
...@@ -661,15 +722,15 @@ export default { ...@@ -661,15 +722,15 @@ export default {
this.areas.push({ this.areas.push({
Name: "热门目的地", Name: "热门目的地",
SubList: hotArr, SubList: hotArr,
Id: '' Id: "",
}); });
this.$EventBus.$emit('hotList', hotArr) this.$EventBus.$emit("hotList", hotArr);
this.selectedArea = hotArr this.selectedArea = hotArr;
this.areas = this.areas.concat(this.baseData.AreaList); this.areas = this.areas.concat(this.baseData.AreaList);
}, },
getHotList(arr) { getHotList(arr) {
let hotArr = []; let hotArr = [];
arr.forEach(item => { arr.forEach((item) => {
if (item.SubList && item.SubList.length) { if (item.SubList && item.SubList.length) {
hotArr = hotArr.concat(this.getHotList(item.SubList)); hotArr = hotArr.concat(this.getHotList(item.SubList));
} else { } else {
...@@ -689,12 +750,12 @@ export default { ...@@ -689,12 +750,12 @@ export default {
let locationName = this.GetDomain(); let locationName = this.GetDomain();
var msg = { var msg = {
RB_Group_Id: this.RB_Group_Id, RB_Group_Id: this.RB_Group_Id,
B2BDomain: locationName B2BDomain: locationName,
}; };
this.apipost( this.apipost(
"ws_post_GetHomeCategoryTreeList", "ws_post_GetHomeCategoryTreeList",
msg, msg,
res => { (res) => {
if (res.data.resultCode == 1) { if (res.data.resultCode == 1) {
if (res.data.data) { if (res.data.data) {
this.categoryList = res.data.data; this.categoryList = res.data.data;
...@@ -706,10 +767,10 @@ export default { ...@@ -706,10 +767,10 @@ export default {
document.URL.indexOf("www.oytour.com") != -1; document.URL.indexOf("www.oytour.com") != -1;
}); });
}, },
err => {} (err) => {}
); );
} },
} },
}; };
</script> </script>
......
src/components/navs/hor-btm.vue
View file @ 54333f83
...@@ -362,20 +362,20 @@ cursor: pointer; ...@@ -362,20 +362,20 @@ cursor: pointer;
</template> </template>
</div> </div>
</template> </template>
<div class="footer-content" v-if="dataList&&dataList.Config"> <div :class="$q.platform.is.desktop ? 'footer-content': 'q-pa-lg'" v-if="dataList&&dataList.Config">
<div class="row justify-between full-width"> <div :class="$q.platform.is.desktop ? 'row justify-between full-width': ''">
<div class=""> <div>
<img style="width:auto;height:35px;" :src="dataList.Config.WhiteLogo" /> <img style="width:auto;height:35px;" :src="dataList.Config.WhiteLogo" />
<div class="rounded-borders q-mt-lg q-pa-md text-grey-8" style="background:rgba(255,255,255,.05)"> <div class="rounded-borders q-mt-lg q-pa-md text-grey-8" style="background:rgba(255,255,255,.05)">
<div class="f12">服务热线：{{ dataList.Config.Tel }}</div> <div class="f12">服务热线：{{ dataList.Config.Tel }}</div>
<div class="q-mt-md">服务时间：08:00 至 21:00</div> <div class="q-mt-md">服务时间：08:00 至 21:00</div>
</div> </div>
</div> </div>
<div class="row"> <div :class="$q.platform.is.desktop ? 'row': 'q-mt-lg'">
<div v-for="(item,i) in dataList.FooterList" :key="item.Id" :class="{'q-ml-xl':i>0}"> <div v-for="(item,i) in dataList.FooterList" :key="item.Id" :class="{'q-ml-xl':i>0 && $q.platform.is.desktop}">
<div class="text-subtitle1 text-weight-bold text-white">{{ item.NavTitle }}</div> <div class=" text-weight-bold text-white" :class="$q.platform.is.desktop ? 'text-subtitle1': 'f14'">{{ item.NavTitle }}</div>
<div class="q-mt-xl" v-if="item.SubList"> <div :class="$q.platform.is.desktop ? 'q-mt-xl': 'q-mt-md'" v-if="item.SubList">
<div class="q-mb-lg text-subtitle2 text-regular text-grey-8 cursor-pointer" v-for="item2 in item.SubList" :key="item2.Id" @click="navigateTo(item2)">{{item2.NavTitle}}</div> <div :class="$q.platform.is.desktop ? 'text-subtitle2 text-regular': 'f12'" class="q-mb-lg text-grey-8 cursor-pointer" v-for="item2 in item.SubList" :key="item2.Id" @click="navigateTo(item2)">{{item2.NavTitle}}</div>
</div> </div>
</div> </div>
</div> </div>
...@@ -388,7 +388,7 @@ cursor: pointer; ...@@ -388,7 +388,7 @@ cursor: pointer;
</div> </div>
</div> </div>
</div> </div>
<div class="text-center q-py-xl text-grey-8" style="margin-top:35px"> <div class="q-py-xl text-grey-8" :class="$q.platform.is.desktop ? 'text-center' : ''" style="margin-top:35px">
蜀ICP备13000760号 © 2010-{{year}} {{ dataList.Config.Name }}. All Rights Reserved. 旅行社业务经营许可证 {{ dataList.Config.UnifyCode }} 蜀ICP备13000760号 © 2010-{{year}} {{ dataList.Config.Name }}. All Rights Reserved. 旅行社业务经营许可证 {{ dataList.Config.UnifyCode }}
</div> </div>
</div> </div>
......
src/pages/login.vue
View file @ 54333f83
...@@ -10,7 +10,7 @@ ...@@ -10,7 +10,7 @@
left: 0; left: 0;
right: 0; right: 0;
} }
.login-box { .login-box-pc {
max-width: 436px; max-width: 436px;
padding: 30px 40px; padding: 30px 40px;
margin: 100px auto; margin: 100px auto;
...@@ -20,6 +20,12 @@ ...@@ -20,6 +20,12 @@
background: #ffffff; background: #ffffff;
border-radius: 18px; border-radius: 18px;
} }
.login-box {
max-width: 436px;
padding: 30px 40px;
background-clip: padding-box;
background: #ffffff;
}
.login-box .tw_logo { .login-box .tw_logo {
margin: 0 auto 20px; margin: 0 auto 20px;
...@@ -83,8 +89,8 @@ ...@@ -83,8 +89,8 @@
} }
</style> </style>
<template> <template>
<div class="login"> <div :class="$q.platform.is.desktop ? 'login': 'full-width'">
<div class="login-box"> <div class="login-box" :class="$q.platform.is.desktop ? 'login-box-pc': ''">
<!-- <img :src="logo" class="tw_logo" /> --> <!-- <img :src="logo" class="tw_logo" /> -->
<!-- <p class="tip-text"> <!-- <p class="tip-text">
還沒有帳號嗎？立即<a style="cursor:pointer;" @click="CommonJump('/register',{})">免費加入</a> 還沒有帳號嗎？立即<a style="cursor:pointer;" @click="CommonJump('/register',{})">免費加入</a>
......
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