Skip to content

A
Athena
Commit aeaa60f7 authored by 华国豪's avatar 华国豪 🙄
Browse files
Options

改版积分商城

parent 09727e2d
Hide whitespace changes
Inline Side-by-side
Showing with 480 additions and 6 deletions
src/assets/mall/newHead.css
View file @ aeaa60f7
...@@ -143,6 +143,8 @@ ul,li{list-style: none;} ...@@ -143,6 +143,8 @@ ul,li{list-style: none;}
height: 100%; height: 100%;
width: 100px; width: 100px;
line-height: 40px; line-height: 40px;
background-color: #ee4454;
position: relative;
} }
.new_header_nav_three ul._t_nav_box li:hover{ .new_header_nav_three ul._t_nav_box li:hover{
background-color: #DF3343 background-color: #DF3343
...@@ -169,4 +171,44 @@ ul,li{list-style: none;} ...@@ -169,4 +171,44 @@ ul,li{list-style: none;}
} }
.new_header_nav_three ul._t_nav_box li div .icon-xia{ .new_header_nav_three ul._t_nav_box li div .icon-xia{
padding-left: 2px; padding-left: 2px;
}
.new_header_nav_three .el-menu--horizontal>.el-submenu .el-submenu__title{
height: 40px;
line-height: 40px;
color: white;
}
.new_header_nav_three .el-menu--horizontal>.el-submenu .el-submenu__icon-arrow{
color: white;
}
.new_header_nav_three .el-menu--horizontal>.el-submenu .el-submenu__title:hover {
background-color: #DF3343;
}
.new_header_nav_three .el-menu--horizontal>.el-submenu:hover .el-submenu__title {
color: white;
}
.new_header_nav_three ._t_nav_box .__tour .__splice{
position: absolute;
right: 0;
bottom: 0px;
color: rgba(203,39,54,1);
}
.new_header_nav_three .el-menu--horizontal>.el-submenu:focus .el-submenu__title{
color: white;
}
.new_header_nav_three_select .el-menu--popup {
background-color: white !important;
}
.new_header_nav_three_select.el-menu--horizontal .el-menu .el-menu-item,.new_header_nav_three_select.el-menu--horizontal .el-menu .el-submenu__title{
height: initial;
line-height: 22px;
}
.new_header_nav_three_select .el-submenu__icon-arrow{
display: none;
}
.new_header_nav_three_select .el-menu--popup-bottom-start{
margin-top: 0;
border-radius: 0;
}
.new_header_nav_three_select.el-menu--horizontal .el-menu .el-submenu__title{
padding: 5px 25px 10px 25px;
} }
\ No newline at end of file
src/components/global/newHead.vue
View file @ aeaa60f7
...@@ -133,11 +133,56 @@ ...@@ -133,11 +133,56 @@
<span class="__splice">|</span> <span class="__splice">|</span>
</div> </div>
</li> </li>
<li :class="{_active: navActive === 1}"> <li :class="{_active: navActive === 1}" class="__tour">
<div @click="handleSelect('/heel', 1), navActive = 1"> <el-menu class="el-menu-demo" mode="horizontal">
<el-submenu index="2" popper-class="new_header_nav_three_select">
<template slot="title" ><span @click="handleSelect('/heel', 1), navActive = 1">跟团游</span></template>
<el-submenu index="2-1">
<template slot="title">
<div>
<p>日本线</p>
<p>东京 高雄 花莲 北海道 </p>
</div>
</template>
<el-menu-item index="2-1-1">
<div>
<p>日本线</p>
</div>
</el-menu-item>
</el-submenu>
<el-submenu index="2-2">
<template slot="title">
<div>
<p>欧洲线</p>
<p>东京 高雄 花莲 北海道 </p>
</div>
</template>
<el-menu-item index="2-2-1">
<div>
<p>欧洲线</p>
</div>
</el-menu-item>
</el-submenu>
<el-submenu index="2-3">
<template slot="title">
<div>
<p>东南亚线</p>
<p>东京 高雄 花莲 北海道 </p>
</div>
</template>
<el-menu-item index="2-3-1">
<div>
<p>东南亚线</p>
</div>
</el-menu-item>
</el-submenu>
</el-submenu>
</el-menu>
<span class="__splice">|</span>
<!-- <div @click="handleSelect('/heel', 1), navActive = 1">
<span>跟团游</span> <span>跟团游</span>
<span class="__splice">|</span> <span class="__splice">|</span>
</div> </div> -->
<!-- <div> <!-- <div>
<el-dropdown trigger="click" placement="bottom-start"> <el-dropdown trigger="click" placement="bottom-start">
<span class="el-dropdown-link"> <span class="el-dropdown-link">
......
src/components/newPersonalCenter/integral/index.vue
View file @ aeaa60f7
...@@ -13,7 +13,7 @@ ...@@ -13,7 +13,7 @@
</template> </template>
<script> <script>
import exchange from '@/components/newPersonalCenter/integral/model/exchange' import exchange from '@/components/newPersonalCenter/integral/model/exchange'
import integralHome from '@/components/newPersonalCenter/integral/model/integralHome' import integralHome from '@/components/newPersonalCenter/integral/model/integralHomeV2'
import integralDetail from '@/components/newPersonalCenter/integral/model/integralDetail' import integralDetail from '@/components/newPersonalCenter/integral/model/integralDetail'
export default { export default {
components: { components: {
......
src/components/newPersonalCenter/integral/model/commodity.vue 0 → 100644
View file @ aeaa60f7
<style scoped>
.commodity{
background-color: white;
border-bottom: 1px solid rgba(236, 236, 236, 1);
}
.commodity .info{
padding: 26px;
text-align: center;
border-left: 1px solid rgba(236, 236, 236, 1);
border-right: 1px solid rgba(236, 236, 236, 1);
font-size:14px;
color: #333333;
}
.commodity .info ._name{
padding: 15px 0 10px 0;
}
.commodity .info ._detais{
color: #999999;
}
.commodity .small{
text-align: center;
padding: 20px 10px;
border-right: 1px solid rgba(236, 236, 236, 1);
border-bottom: 1px solid rgba(236, 236, 236, 1);
font-size:14px;
color: #333333;
}
.commodity .small img{
max-height: 110px;
}
.commodity .small ._name{
margin: 5px 0 15px 0;
}
.commodity .small ._detais{
color: #999999;
}
.commodity .medium{
}
.commodity .medium{
padding: 29px ;
text-align: center;
border-right: 1px solid rgba(236, 236, 236, 1);
}
.commodity .medium img{
max-height: 138px;
}
.commodity .medium ._name{
margin: 5px 0 15px 0;
}
.commodity .medium ._detais{
color: #999999;
}
</style>
<template>
<el-row class="commodity">
<el-col :span="10">
<div class="info">
<div>
<img src="../../../../assets/img/img-01.png" alt>
</div>
<p class="_name">出行必备物品</p>
<p class="_detais">699积分抢兑</p>
</div>
</el-col>
<el-col :span="14">
<el-row>
<el-col :span="8" class="small">
<div>
<img src="../../../../assets/img/img-01.png" alt>
</div>
<p class="_name">出行必备物品</p>
<p class="_detais">699积分抢兑</p>
</el-col>
<el-col :span="8" class="small">
<div>
<img src="../../../../assets/img/img-01.png" alt>
</div>
<p class="_name">出行必备物品</p>
<p class="_detais">699积分抢兑</p>
</el-col>
<el-col :span="8" class="small">
<div>
<img src="../../../../assets/img/img-01.png" alt>
</div>
<p class="_name">出行必备物品</p>
<p class="_detais">699积分抢兑</p>
</el-col>
</el-row>
<el-row>
<el-col :span="12" class="medium f">
<div>
<img src="../../../../assets/img/img-01.png" alt>
</div>
<p class="_name">出行必备物品</p>
<p class="_detais">699积分抢兑</p>
</el-col>
<el-col :span="12" class="medium">
<div>
<img src="../../../../assets/img/img-01.png" alt>
</div>
<p class="_name">出行必备物品</p>
<p class="_detais">699积分抢兑</p>
</el-col>
</el-row>
</el-col>
</el-row>
</template>
<script>
export default {};
</script>
src/components/newPersonalCenter/integral/model/integralHomeV2.vue 0 → 100644
View file @ aeaa60f7
<style>
.bg_f5{background-color: #f5f5f5}
.integralHomeV2{padding: 20px 0;}
.integralHomeV2 .head_info{
text-align: center;
background-color: #FFFFFF;
padding: 29px 0;
}
.integralHomeV2 .head_info div img{
width: 80px;
}
.integralHomeV2 .head_info ._tit{
font-size: 14px;
color: rgba(51,51,51,1);
}
.integralHomeV2 .head_info ._number{
margin-top: 20px;
font-size: 36px;
color: rgba(249,83,85,1);
}
.integralHomeV2 .head_ban{overflow: hidden;}
.integralHomeV2 .head_ban img{
height: 228px;
}
.integralHomeV2 .men .el-col.el-col-6>div{
display: flex;
font-size: 12px;
color: #666666;
background-color: white;
margin: 30px 0;
justify-content: space-between;
align-items: center;
padding: 15px 20px;
}
.fr{
float: right;
}
.fl{
float: left;
}
.integralHomeV2 .men .el-col.el-col-6 .font_bla{
font-size: 16px;
color: #111111;
margin-bottom: 10px;
}
.integralHomeV2 .class ,.integralHomeV2 .advert{
margin-bottom: 25px;
}
.integralHomeV2 .class .tit div{
display: flex;
align-items: center;
font-size: 16px;
color: #333333;
padding: 20px 24px;
background-color: white;
}
.integralHomeV2 .class .tit{
border:1px solid rgba(236, 236, 236, 1);
}
.integralHomeV2 .class .tit{
max-height: 360px
}
.integralHomeV2 .class .tit div img{
width: 17px;
padding-right: 10px;
}
.integralHomeV2 .advert .el-col-12 div{
height: 180px;
background-color: white;
position: relative;
}
.integralHomeV2 .advert .el-col-12 div .tag{
position: absolute;
width:80px;
height:36px;
background:rgba(238,68,84,1);
text-align: center;
line-height: 36px;
font-size:16px;
top: 0;
left: 30px;
color: white;
}
.integralHomeV2 .class .item{
float: left;
width: 16.505%;
height: 200px;
padding: 20px;
text-align: center;
background-color: white;
border: 1px solid rgba(236, 236, 236, 1);
border-left: none;
border-top: none;
}
.integralHomeV2 .class .item:nth-child(1),.integralHomeV2 .class .item:nth-child(6){
border-left: 1px solid rgba(236, 236, 236, 1);
}
.integralHomeV2 .class .item img{
max-height: 150px;
}
.integralHomeV2 .class .item ._name{
font-size:12px;
color:rgba(51,51,51,1);
margin-top: 10px;
}
.integralHomeV2 .class .item ._detais{
font-size:12px;
color:rgba(255,1,1,1);
margin-top: 12px;
}
</style>
<template>
<!-- 积分首页 -->
<el-row class="bg_f5">
<el-row class="integralHomeV2 w1180">
<!-- top -->
<el-row class="head">
<el-col :span="4" class="head_info">
<div>
<img v-if="StorageInfo.photo" :src="StorageInfo.photo" alt="">
<img v-else src="../../../../assets/img/head_normal1.png" alt="">
</div>
<p class="_tit">我的积分</p>
<p class="_number">1288</p>
</el-col>
<el-col :span="20" class="head_ban">
<img src="../../../../assets/img/ps/jifenban.png" alt="">
</el-col>
</el-row>
<!-- men -->
<el-row class="men" :gutter="20">
<el-col :span="6">
<div>
<div>
<p class="font_bla">赚积分攻略</p>
<p>玩转积分，领取大奖</p>
</div>
<div>
<img src="../../../../assets/img/ps/jifenzhuan.png" alt="">
</div>
</div>
</el-col>
<el-col :span="6">
<div>
<div>
<p class="font_bla">积分精准查</p>
<p>玩转积分，领取大奖</p>
</div>
<div>
<img src="../../../../assets/img/ps/jifencha.png" alt="">
</div>
</div>
</el-col>
<el-col :span="6">
<div>
<div>
<p class="font_bla">积分商城任你选</p>
<p>大牌随心兑</p>
</div>
<div>
<img src="../../../../assets/img/ps/jifenxuan.png" alt="">
</div>
</div>
</el-col>
<el-col :span="6">
<div>
<div>
<p class="font_bla">我的积分订单</p>
<p>会员积分兑</p>
</div>
<div>
<img src="../../../../assets/img/ps/jifending.png" alt="">
</div>
</div>
</el-col>
</el-row>
<!-- class -->
<el-row class="class">
<el-row class="tit">
<div>
<img src="../../../../assets/img/ps/jifenhot.png" alt="">
<p>热门精品推荐</p>
</div>
</el-row>
<Vcommodity/>
</el-row>
<el-row class="class">
<el-row class="tit">
<div>
<img src="../../../../assets/img/ps/jifenchou.png" alt="">
<p>积分抽大奖</p>
</div>
</el-row>
<Vcommodity/>
</el-row>
<el-row class="class">
<el-row class="tit">
<div>
<img src="../../../../assets/img/ps/jifenli.png" alt="">
<p>999积分享好礼</p>
</div>
</el-row>
<Vcommodity/>
</el-row>
<el-row class="advert" :gutter="20">
<el-col :span="12">
<div>
<span class="tag">印象精选</span>
</div>
</el-col>
<el-col :span="12">
<div>
<span class="tag">印象精选</span>
</div>
</el-col>
</el-row>
<el-row class="class">
<el-row class="tit">
<div>
<img src="../../../../assets/img/ps/jifendui.png" alt="">
<p>积分兑好礼</p>
</div>
</el-row>
<el-row>
<div class="clearfix">
<div class="info item" v-for="item in list">
<div>
<img src="../../../../assets/img/img-01.png" alt>
</div>
<p class="_name">出行必备物品</p>
<p class="_detais">699积分抢兑</p>
</div>
</div>
</el-row>
</el-row>
</el-row>
</el-row>
</template>
<script>
import commodity from '@/components/newPersonalCenter/integral/model/commodity'
export default {
components: {
Vcommodity: commodity,
},
props:{},
data(){
return{
StorageInfo: {},
list: [1,2,3,4,5,6,7,8,9,10]
}
},
created(){
let userInfo = this.getLocalStorage();
this.StorageInfo = userInfo
},methods:{
goExchange: function(){
this.MsgBus.$emit('goCPage', '4-3')
}
},mounted(){
}
}
</script>
src/components/newPersonalCenter/newPersonalCenter.vue
View file @ aeaa60f7
...@@ -85,7 +85,7 @@ ...@@ -85,7 +85,7 @@
<i class="iconfont icon-gerenxinxiicon"></i> <i class="iconfont icon-gerenxinxiicon"></i>
<span>我的积分</span> <span>我的积分</span>
</template> </template>
<el-menu-item index="4-1" @click="clickMenu('4-1')">积分首页</el-menu-item> <el-menu-item index="4-1" @click="goUrl('integral')">积分首页</el-menu-item>
<el-menu-item index="4-2" @click="clickMenu('4-2')">积分明细</el-menu-item> <el-menu-item index="4-2" @click="clickMenu('4-2')">积分明细</el-menu-item>
<el-menu-item index="4-3" @click="clickMenu('4-3')">我的兑换</el-menu-item> <el-menu-item index="4-3" @click="clickMenu('4-3')">我的兑换</el-menu-item>
</el-submenu> </el-submenu>
...@@ -149,6 +149,9 @@ export default { ...@@ -149,6 +149,9 @@ export default {
} }
}, },
methods: { methods: {
goUrl(path){ //跳转方法
this.$router.push({name: path});
},
handleOpen(key, keyPath) { handleOpen(key, keyPath) {
// console.log(key, keyPath); // console.log(key, keyPath);
}, },
......
src/plugins/index.js
View file @ aeaa60f7
...@@ -18,7 +18,7 @@ export default { ...@@ -18,7 +18,7 @@ export default {
// let domainUrl = "https://reborn.oytour.com"; //刘东主域名 // let domainUrl = "https://reborn.oytour.com"; //刘东主域名
let domainUrl = "https://reborn.oytour.com"; let domainUrl = "https://reborn.oytour.com";
// var domainUrl = "http://test.viitto.com" // var domainUrl = "http://test.viitto.com"
domainUrl = "http://192.168.2.214:8082" // domainUrl = "http://192.168.2.214:8082"
let locationName = window.location.hostname; let locationName = window.location.hostname;
if (this.isOnline()) { if (this.isOnline()) {
if (window.location.host.indexOf('viitto.com') != -1) if (window.location.host.indexOf('viitto.com') != -1)
......
src/router.js
View file @ aeaa60f7
...@@ -144,6 +144,14 @@ export default new Router({ ...@@ -144,6 +144,14 @@ export default new Router({
title: "搜索行程-印象之旅~感动与世界同步" title: "搜索行程-印象之旅~感动与世界同步"
} }
}, },
{
path: "/integral",
name: "integral",
component: resolve => require(["@/components/newPersonalCenter/integral/model/integralHomeV2"], resolve),
meta: {
title: "我的积分-印象之旅~感动与世界同步"
}
},
{ {
path: "/PersonalHome", path: "/PersonalHome",
name: "PersonalHome", name: "PersonalHome",
......
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