Skip to content

A
Athena
Commit 691f5bb9 authored by huangyuanyuan's avatar huangyuanyuan
Browse files
Options

Merge branch 'master' of http://gitlab.oytour.com/huaguohao/athena

parents 39952120 63b6fe48
Hide whitespace changes
Inline Side-by-side
Showing with 1608 additions and 138 deletions
src/App.vue
View file @ 691f5bb9
......@@ -59,7 +59,7 @@ export default {
<style>
@import './assets/global/font.css';
@import '//at.alicdn.com/t/font_863923_wzxnabnk91k.css';
@import '//at.alicdn.com/t/font_863923_59ny99vyyvp.css';
@import './assets/global/global.css';
body,html{
padding: 0px;
......
src/assets/mall/newHead.css
View file @ 691f5bb9
......@@ -12,6 +12,11 @@ ul,li{list-style: none;}
width: 1180px !important;
margin: 0 auto;
}
.w1200{
width: 1200px !important;
margin: 0 auto;
}
.w85{
width: 85px !important;
}
......
src/components/IntegralMall/IntegralDetail.vue 0 → 100644
View file @ 691f5bb9
<style>
.IntegralDetail{
background-color: #f5f5f5;
padding-bottom:20px;
}
.IntegralDetail .breadcrumb{
padding: 20px 0;
}
.IntegralDetail .pd_top_info{
height: 554px;
}
.IntegralDetail .Ingegra_Top{
width:100%;
height:70px;
line-height: 70px;
}
.IntegralDetail .Integra_Content{
width:100%;
height:auto;
background-color: #fff;
margin-left:20px;
}
.IntegralDetail .Integra_left{
float:left;
width:250px;
font-size:16px;
color:#333333;
font-weight: bold;
margin-left:20px;
}
.IntegralDetail .Integra_right{
float:right;
color:#FFA835;
font-size:12px;
margin-right: 20px;
}
.IntegralDetail .Integra_right img{
position: relative;
top:2px;
left:-5px;
width:14px;
}
.IntegralDetail .IngegraTable{
width: 96%;
border-collapse: collapse;
font-size:14px;
margin:auto;
}
.IntegralDetail .IngegraTable th{
background-color: #F8F8F8;
height:40px;
font-size:12px;
color:#666666;
}
.IntegralDetail .IngegraTable td{
padding:18px;
background-color: #fff;
text-align: center;
color:#666666;
border-bottom:1px solid #E9E9E9;
font-size:12px;
}
.IntegralDetail .IngegraTable tr:hover td{
background-color: #FFF0F0;
}
.IntegralDetail .pointOrderTime{
color:#999999;
}
.IntegralDetail .pointOrderNum{
color:#333333
}
.IntegralDetail .pointOrderTitle{
margin-left:30px;
color:#666666;
}
.IntegralDetail .pointDetailBtn{
width:64px;
height:24px;
color:#fff;
outline: none;
border:none;
background-color: #EE4454;
border-radius:4px;
margin-bottom:10px;
cursor: pointer;
font-size:12px;
}
.IntegralDetail .pointCancelBtn{
width:64px;
height:24px;
outline: none;
color:#666666;
background-color: transparent;
border:1px solid rgba(102,102,102,1);
border-radius:4px;
cursor: pointer;
font-size:12px;
}
.IntegralDetail .po_info{
display: flex;
align-items: center;
}
.IntegralDetail .po_left{
width: 70px;
height: 70px;
background-color: #fff;
margin-right: 10px;
border:1px solid #ECECEC;
display: inline-block;
}
.IntegralDetail .po_right{
color: #666666;
font-size: 14px;
display: inline-block;
width: 220px;
text-align: left;
}
.IntegralDetail .po_type{
width:80px;
text-align: left;
margin:auto;
color:#333333;
}
/* 分页样式 */
.IntegralDetail ._pagination{
height: 45px;
display: flex;
align-items: center;
justify-content: flex-end;
margin-right:15px;
}
.IntegralDetail .el-pagination .btn-next,.IntegralDetail .el-pagination .btn-prev{
width:40px !important;
height:20px !important;
border:1px solid rgba(238,68,84,1);
border-radius:10px;
color: #f56c6c;
}
.IntegralDetail .el-pagination{
display: flex;
align-items: center;
}
.IntegralDetail .el-pager li{
background: transparent;
font-weight: initial;
}
.IntegralDetail .el-pager li.active{
color: #f56c6c;
}
.IntegralDetail .Integral_InOut{
color:#FF0101!important;
}
</style>
<template>
<el-row class="IntegralDetail">
<div class="w1200">
<el-row>
<el-breadcrumb separator-class="el-icon-arrow-right" class="breadcrumb">
<el-breadcrumb-item :to="{ path: '/IntegralMall' }">积分商城</el-breadcrumb-item>
<el-breadcrumb-item>积分明细</el-breadcrumb-item>
</el-breadcrumb>
</el-row>
<el-row class="pd_bottom_detail">
<el-col :span="5">
<detailsLeftHot/>
</el-col>
<el-col :span="19">
<el-row>
<div class="Integra_Content">
<div class="Ingegra_Top clearfix">
<div class="Integra_left">
积分明细
</div>
<div class="Integra_right">
<img src="../../assets/img/ticket/jfgz.png" alt=""/>查看积分规则
</div>
</div>
<table class="IngegraTable">
<tr>
<th>日期</th>
<th>收入/支出</th>
<th>详细说明</th>
</tr>
<tr v-for="item in dataList">
<td>{{item.createTime | YMDHMS}}</td>
<td>
<span v-if="item.integralNum>0" class="Integral_InOut">+{{item.integralNum}}</span>
<span v-else>{{item.integralNum}}</span>
</td>
<td>{{item.integralDescri}}</td>
</tr>
</table>
<div class="empty-data" v-if="dataList.length==0">
<i class="iconfont icon-kong"></i>
很抱歉，你想要的信息我们真的找不到了
</div>
<!-- 分页 -->
<el-row class="_pagination" v-if="totalCount > 1 && dataList.length>0">
<el-pagination
:current-page.sync="currentPage"
:page-size="msg.pageSize"
layout="total, prev, pager, next"
:total="Count"
@current-change="handleCurrentChange"
></el-pagination>
</el-row>
</div>
</el-row>
</el-col>
</el-row>
</div>
</el-row>
</template>
<script>
import detailsLeftHot from '@/components/IntegralMall/block/detailsLeftHot'
export default {
components:{
detailsLeftHot
},
data(){
return {
currentPage: 1,
totalCount: 0,
Count: 1,
msg: {
pageIndex: 1,
pageSize: 10,
},
dataList:[]
}
},methods:{
handleCurrentChange(val) {
// 翻页
this.msg.pageIndex = parseInt(val);
this.getList();
},
goUrl: function (path) {
this.$router.push({name: path});
},
getList(){
this.apiJavaPost('/api/orderForm/integralDetail',this.msg,res=>{
if(res.data.resultCode==1){
this.dataList = res.data.data.pageData;
this.totalCount = res.data.data.pageCount;
this.Count = res.data.data.count;
}else{
this.Error(res.data.message);
}
},null)
},
},mounted(){
this.getList();
}
}
</script>
src/components/IntegralMall/IntegralMall.vue
View file @ 691f5bb9
......@@ -35,7 +35,7 @@
<p>热门精品推荐</p>
</div>
</el-row>
<commodity/>
<commodity v-bind:message="dataList[0].list"/>
</div>
<div class="_block">
<el-row class="tit">
......@@ -76,6 +76,7 @@ export default {
data(){
return{
ClassifyGoodsList: [],
dataList:[]
}
},methods: {
getClassifyGoods: function () {
......@@ -91,10 +92,22 @@ export default {
},
null
);
}
},
//获取活动分类展示
getActivesList(){
this.apiJavaPost('/api/goodsMarket/getActivityClassifyGoods',{},res=>{
if(res.data.resultCode==1){
this.dataList = res.data.data;
}else{
this.Error(res.data.message);
}
},null)
},
},
mounted() {
this.getClassifyGoods()
this.getClassifyGoods();
this.getActivesList();
}
}
</script>
src/components/IntegralMall/OrderCompleted.vue 0 → 100644
View file @ 691f5bb9
<style>
.OrderCompleted{
background-color: #f5f5f5;
padding-bottom: 20px;
}
.OrderCompleted .OC_top{
width:1090px;
height:auto;
font-size:12px;
margin: auto;
padding:30px 0;
position: relative;
}
.OrderCompleted .OC_TopLeft{
width:60px;
display: inline-block;
text-align: center;
}
.OrderCompleted .O_radius{
width:26px;
height:26px;
background-color: #EE4454;
border-radius: 50%;
color:#fff;
text-align: center;
line-height: 26px;
margin:9px auto;
}
.OrderCompleted .OC_Line{
width:1004px;
height:3px;
background-color: #EE4454;
display: inline-block;
position: relative;
top:-33px;
left:-17px;
}
.OrderCompleted .OC_TopRight{
width:60px;
position: absolute;
right:0;
top:30px;
text-align: center;
}
.OrderCompleted .OC_content{
width:100%;
height:400px;
border:1px solid #ECECEC;
background-color: #fff;
}
.OrderCompleted .OC_ConLeft{
display:inline-block;
margin:62px 0 0 200px;
width:378px;
}
.OrderCompleted .OC_ConTop img{
float:left;
}
.OrderCompleted .OC_riContent{
float:left;
margin-left:20px;
}
.OrderCompleted .OC_paySuccsss{
font-size:24px;
font-weight: bold;
color:#333333;
}
.OrderCompleted .Order_more{
color: #EE4454;
text-decoration: underline;
cursor: pointer;
}
.OrderCompleted .OC_dianhua{
font-size:12px;
margin-top:10px;
}
.OrderCompleted .OC_btmList{
width:320px;
margin-top:63px;
font-size:12px;
color:#333333;
}
.OrderCompleted .OC_btmList>div{
width:100%;
height:40px;
line-height: 40px;
border-bottom:1px solid #DDDDDD;
}
.OrderCompleted .OC_jishu{
width:58%;
}
.OrderCompleted .OC_jifen{
display: inline-block;
}
.OrderCompleted .OC_backBtn{
width: 87px;
height: 28px;
color: #fff;
outline: none;
border: none;
margin-top:45px;
background-color: #EE4454;
border-radius: 4px;
cursor: pointer;
font-size: 12px;
}
.OrderCompleted .OC_rightImg{
display:inline-block;
width:354px;
height:289px;
margin-left:70px;
}
.OrderCompleted .OC_rightImg img{
width:100%;
}
</style>
<template>
<!-- 积分明细 -->
<div class="OrderCompleted">
<div class="w1200">
<div class="OC_top">
<div class="OC_TopLeft">
<div class="O_radius">1</div>
确认订单
</div>
<div class="OC_Line"></div>
<div class="OC_TopRight">
<div class="O_radius">2</div>
订单完成
</div>
</div>
<div class="OC_content">
<div class="OC_ConLeft">
<div class="OC_ConTop clearfix">
<img src="../../assets/img/ticket/icons8-tick-box-96.png" alt=""/>
<div class="OC_riContent">
<div class="OC_paySuccsss">支付成功！</div>
<div class="OC_dianhua">如有任何疑问可致电028-56540254，点击 <span class="Order_more" @click="goUrl('OrderdetailsCompleted')">查看订单>></span></div>
</div>
</div>
<div class="OC_btmList">
<div>
<div class="OC_jifen OC_jishu">
支付积分：￥9900
</div>
<div class="OC_jifen">
剩余积分：￥190010
</div>
</div>
<div>
<div class="OC_jifen OC_jishu">
订单编号：45612312321
</div>
<div class="OC_jifen">
下单时间：2019-02-21
</div>
</div>
</div>
<input type="button" value="返回积分商城" class="OC_backBtn"/>
</div>
<div class="OC_rightImg">
<img src="../../assets/img/ticket/back.png" alt=""/>
</div>
</div>
</div>
</div>
</template>
<script>
export default {
components: {
},
props:{},
data(){
return{
}
},methods: {
goUrl: function (path) {
this.$router.push({name: path,query: { id: this.$route.query.id}});
}
}
}
</script>
src/components/IntegralMall/OrderdetailsCompleted.vue 0 → 100644
View file @ 691f5bb9
<style>
.OrderdetailCompleted{
background-color: #f5f5f5
}
.OrderdetailCompleted .breadcrumb{
padding: 20px 0;
}
.Order_Top{
width:100%;
height:300px;
border:1px solid #ECECEC;
background-color: #fff;
border-top:4px solid #F2DADA;
}
.Order_Top_left{
display:inline-block;
width:326px;
height:100%;
border-right:1px solid #ECECEC;
text-align: center;
font-size:12px;
color:#666666;
}
.Order_Top_right{
font-size:12px;
color:#333333;
float:right;
margin:120px 25px 0 0;
}
.Order_Complate{
margin-top:109px;
}
.Order_Complate span{
position: relative;
top:-18px;
margin-left:20px;
color:#4CAF50;
font-size:24px;
font-weight: bold;
}
.Order_jifen{
margin:20px 0;
}
.Submit_Orders i{
display: block;
font-size:25px;
color:#4CAF50;
margin-bottom:10px;
}
.Submit_Orders{
width:80px;
display: inline-block;
text-align: center;
}
.SubmitComLine{
display:inline-block;
position: relative;
top:-28px;
}
.Submit_Orders img{
width:22px;
position: relative;
top:-8px;
}
.OrderdetailCompleted .myPointTable{
width: 100%;
border: solid 1px #EDEDED;
border-collapse: collapse;
font-size:14px;
margin:20px 0;
}
.OrderdetailCompleted .myPointTable td{
padding:17px 15px;
background-color: #fff;
color:#333333;
border:1px solid #ECECEC;
font-size:12px;
}
.OrderdetailCompleted .pointOrderTime{
color:#999999;
}
.OrderdetailCompleted .pointOrderNum{
color:#333333
}
.OrderdetailCompleted .pointOrderTitle{
margin-left:30px;
color:#666666;
}
.OrderdetailCompleted .po_info{
display: flex;
align-items: center;
}
.OrderdetailCompleted .po_left{
width: 70px;
height: 70px;
background-color: #fff;
margin-right: 10px;
border:1px solid #ECECEC;
display: inline-block;
}
.OrderdetailCompleted .po_right{
color: #666666;
font-size: 14px;
display: inline-block;
width: 220px;
text-align: left;
}
.OrderdetailCompleted .pointCancelBtn{
width:64px;
height:24px;
outline: none;
color:#666666;
background-color: transparent;
border:1px solid rgba(102,102,102,1);
border-radius:4px;
cursor: pointer;
font-size:12px;
}
.OrderShouContent{
font-size:12px;
color:#333333;
margin-left:20px;
}
.Order_left,.Order_right{
display:inline-block;
vertical-align:top;
}
.Order_right{
margin-left:20px;
text-align: left;
}
.Order_right div{
margin-bottom:5px;
}
.Order_more{
color:#EE4454;
text-decoration: underline;
cursor: pointer;
}
</style>
<template>
<el-row class="OrderdetailCompleted">
<div class="w1200">
<el-row>
<el-breadcrumb separator-class="el-icon-arrow-right" class="breadcrumb">
<el-breadcrumb-item :to="{ path: '/IntegralMall' }">积分商城</el-breadcrumb-item>
<el-breadcrumb-item :to="{ path: '/myPointOrder' }">我的订单</el-breadcrumb-item>
<el-breadcrumb-item>订单详情</el-breadcrumb-item>
</el-breadcrumb>
</el-row>
<div class="OrderContent">
<div class="Order_Top">
<div class="Order_Top_left">
<div class="Order_Complate">
<img src="../../assets/img/ticket/icons8-tick-box-96.png" alt=""/>
<span>完成</span>
</div>
<div class="Order_jifen">
支付积分：￥9900
</div>
<div>
剩余积分：￥{{score}}
</div>
</div>
<div class="Order_Top_right">
<div class="Submit_Orders">
<i class="iconfont icon-order_icon"/>
提交订单
</div>
<div class="SubmitComLine">
<img src="../../assets/img/orderLins.png" alt=""/>
</div>
<div class="Submit_Orders">
<i class="iconfont icon-xunhuan"/>
确认兑换
</div>
<div class="SubmitComLine">
<img src="../../assets/img/orderLins.png" alt=""/>
</div>
<div class="Submit_Orders">
<i class="iconfont icon-gerenzhongxindingdandaishouhuo"/>
确认兑换
</div>
<div class="SubmitComLine">
<img src="../../assets/img/orderLins.png" alt=""/>
</div>
<div class="Submit_Orders">
<!-- <div><img src="../../assets/img/ticket/icons8-tick-box-96.png" alt=""/></div> -->
<div><img src="../../assets/img/ticket/huigou.png" alt=""/></div>
订单完成
</div>
</div>
</div>
<table class="myPointTable">
<tr>
<td colspan="3">
<span class="pointOrderTime">{{orderTime | YMDHMS}}</span>
<span class="pointOrderTitle">订单号：</span><span class="pointOrderNum">451648</span>
</td>
</tr>
<tr>
<td width="325px">
<div class="po_info">
<div class="po_left">
<img :src="imageUrl" alt=""/>
</div>
<div class="po_right">
{{orderTitle}}
</div>
</div>
</td>
<td>
<div class="OrderShouContent" v-if="index<num" v-for="(item,index) in data">
<div class="Order_left">
{{item.time}}
</div>
<div class="Order_right">
<div v-for="(subItem,subIndex) in item.list">
{{subItem}}
<span @click="DataLength(1)" v-if="num==1&&data.length>1&&subIndex==item.list.length-1" class="Order_more">查看更多>></span>
<span @click="DataLength(2)" v-if="num>1&&index==data.length-1&&subIndex==item.list.length-1" class="Order_more">收起>></span>
</div>
</div>
</div>
</td>
<td width="132px" style="text-align:center;">
<input type="button" class="pointCancelBtn" value="取消订单">
</td>
</tr>
</table>
</div>
</div>
</el-row>
</template>
<script>
export default {
data(){
return {
num:1,
id:0,
//时间
orderTime:'',
//订单号
orderNum:'',
//图片
imageUrl:'',
//标题
orderTitle:'',
score:'',
data:[
{
time:"2019-08-08",
list:[
"09:26:17包裹正在等待收货",
"09:26:17包裹正在等待收货",
"09:26:17包裹正在等待收货",
"09:26:17包裹正在等待收货",
]
},
{
time:"2019-08-09",
list:[
"09:26:17包裹正在等待收货",
"09:26:17包裹正在等待收货",
"09:26:17包裹正在等待收货",
"09:26:17包裹正在等待收货",
]
}
]
}
},methods:{
DataLength(num){
if(num==2){
this.num=1;
}else{
this.num=this.data.length;
}
},
getInfo(){
let msg = {
goodId:this.id
}
this.apiJavaPost('/api/goodsMarket/getGoodsDetail',msg,res=>{
if(res.data.resultCode==1){
this.dataList = res.data.data;
this.orderTime = dataList.updateTime;
this.imageUrl = dataList.images.images.split(',')[0];
this.orderTitle = dataList.name;
}else{
this.Error(res.data.message);
}
});
},
//获取积分
getScore(){
this.apiJavaPost('/api/orderForm/getTotalIntegrals',{},res=>{
if(res.data.resultCode==1){
this.score = res.data.data;
}else{
this.Error(res.data.message);
}
});
},
},mounted(){
this.getInfo();
this.getScore();
},created(){
this.id = this.$route.query.id;
}
}
</script>
src/components/IntegralMall/confirOrder.vue
View file @ 691f5bb9
......@@ -182,7 +182,7 @@
}
</style>
<template>
<el-row class="confirOrder">
<el-row class="confirOrder" v-loading="loading">
<el-row class="w1180">
<!-- top -->
<el-row class="bar_box">
......@@ -210,19 +210,19 @@
<el-row :gutter="20">
<el-col
:span="6"
v-for="(item, index) in addList"
v-for="(item, index) in OrderAddList"
:key="index"
:class="{'_active': addListActive === index}"
>
<div class="address_info_item" @click="addListActive = index">
<p class="item_name">{{item.city}}（{{item.name}}）</p>
<p class="item_add">{{item.addr}}</p>
<p class="item_tel">{{item.tel}}</p>
<p class="item_name">{{item.city}}（{{item.uname}}）</p>
<p class="item_add">{{item.district}} {{item.address}}</p>
<p class="item_tel">{{item.uphone}}</p>
</div>
</el-col>
</el-row>
<div class="edit_addr">
<span class="edit_addr_btn" @click="addressShow = false">修改地址</span>
<span class="edit_addr_btn" v-if="OrderAddList.length>0" @click="addressShow = false,getUpAddress()">修改地址</span>
</div>
</div>
<div v-else class="form_box">
......@@ -246,7 +246,7 @@
<el-input v-model="form.tel" size="mini" :disabled="true"></el-input>
</el-form-item>
<div class="edit_addr">
<span class="edit_addr_btn edit_addr_btn2" @click="addressShow = true">确认修改</span>
<span class="edit_addr_btn edit_addr_btn2" @click="addressShow = true,sureUpdate()">确认修改</span>
</div>
</el-form>
</div>
......@@ -255,49 +255,49 @@
<!-- product -->
<el-row class="product_box">
<el-table :data="tableData" border style="width: 100%">
<el-table-column prop="date" label="商品信息">
<el-table-column prop="images" label="商品信息">
<template slot-scope="scope">
<div class="product_item">
<div class="img_box">
<img src="../../assets/img/img-01.png" alt="">
<img :src="scope.row.imgUrl" alt=""/>
</div>
<div>
<p class="product_name">{{scope.row.date}}</p>
<p class="product_color">颜色：{{scope.row.color}}</p>
<!-- <p class="product_color">颜色：{{scope.row.color}}</p> -->
</div>
</div>
</template>
</el-table-column>
<el-table-column prop="name" label="单价" width="180">
<template slot-scope="scope">
<span style="margin-left: 10px">{{scope.row.name }} 积分</span>
<span style="margin-left: 10px">{{scope.row.score }} 积分</span>
</template>
</el-table-column>
<el-table-column prop="address" label="数量" width="80">
<el-table-column prop="num" label="数量" width="80">
<template slot-scope="scope">
<span style="margin-left: 10px">* {{scope.row.address }}</span>
<span style="margin-left: 10px">* {{scope.row.num }}</span>
</template>
</el-table-column>
<el-table-column label="小计" width="180">
<template slot-scope="scope">
<span style="margin-left: 10px">{{ scope.row.name * scope.row.address }}</span>
<span style="margin-left: 10px">{{ scope.row.score * scope.row.num }}</span>
</template>
</el-table-column>
</el-table>
<div class="sunm">
<p>合计：<span class="small_s">￥ <span>9900</span>积分</span></p>
<p>合计：<span class="small_s">￥ <span>{{tableData[0].score*tableData[0].num}}</span>积分</span></p>
</div>
</el-row>
<!-- details -->
<el-row class="details_box">
<div class="details_box_info">
<p>商品金额 <span>¥ 9900积分</span></p>
<p>总积分 <span>¥ 229900积分</span></p>
<p>商品金额 <span>¥ {{tableData[0].score*tableData[0].num}}积分</span></p>
<p>总积分 <span>¥ {{score}}积分</span></p>
<p>运费 <span>0元</span></p>
<p>应付 <span class="_pay">¥ <span>9900</span> 积分</span></p>
<p>应付 <span class="_pay">¥ <span>{{tableData[0].score*tableData[0].num}}</span> 积分</span></p>
</div>
<div class="details_box_btn">
<span class="edit_addr_btn" @click="">确认并兑换</span>
<span class="edit_addr_btn" @click="exchangeGood()">确认并兑换</span>
</div>
</el-row>
</el-row>
......@@ -323,43 +323,12 @@ export default {
return {
addressShow: true,
addListActive: 0,
addList: [
{
name: "李瀚文",
city: "四川成都",
addr: "锦江区 阳光新业大厦2号楼 2302",
tel: "13800138000"
},
{
name: "王三",
city: "新疆乌鲁木齐",
addr: "新疆乌鲁木齐新平区北巷街250号",
tel: "13800138000"
},
{
name: "李吴",
city: "四川德阳",
addr: "旌阳区华山南路北段266号",
tel: "13800138000"
},
{
name: "郑秀儿",
city: "河南郑州",
addr: "管城回族区二胖大道666号",
tel: "13800138000"
},
{
name: "李瀚文",
city: "四川成都",
addr: "锦江区 阳光新业大厦2号楼 2302",
tel: "13800138000"
}
],
loading:false,
form: {
name: "张三四",
tel: "17602885454",
desc: "成华区光华路665号",
addr: "四川省 成都市 成华区"
name: "",
tel: "",
desc: "",
addr: ""
},
rule: {
name: [{ required: true, message: "请输入姓名", trigger: "blur" }],
......@@ -369,13 +338,19 @@ export default {
},
tableData: [
{
date: "印象推荐款--大容量抽绳化妆包+防水防潮+便携耐用+暗兜设计",
name: 20,
address: 1,
color: '白色'
date: "",
imgUrl:'',
color: '白色',
score:0,
num:0
},
],
OrderAddList: [],
upAddressId:0,
addressObj:[],
id:0,
//个人总积分
score:0,
};
},
methods: {
......@@ -393,10 +368,114 @@ export default {
},
null
);
},
//获取当前收货地址详情
getUpAddress(){
this.addressObj = this.OrderAddList[this.addListActive];
this.form.addr = this.addressObj.province+" "+ this.addressObj.city+" "+ this.addressObj.district;
this.form.desc = this.addressObj.address;
this.form.name = this.addressObj.uname;
this.form.tel = this.addressObj.uphone;
this.upAddressId = this.addressObj.id;
},
//确认修改收货地址
sureUpdate(){
var msg = {
id:this.addressObj.id,
province:this.addressObj.province,
city:this.addressObj.city,
district:this.addressObj.district,
address:this.form.desc,
uname:this.addressObj.uname,
uphone:this.addressObj.uphone,
postcode:''
}
this.apiJavaPost(
"/api/orderForm/saveOrUpdateOrderAdd",msg,
res => {
if (res.data.resultCode === 1) {
this.Success(res.data.message);
this.getOrderAdd();
} else {
this.Error(res.data.message);
}
},
null
);
},
//获取详情
getDetail: function () {
this.loading = true;
this.apiJavaPost(
"/api/goodsMarket/getGoodsDetail",
{goodId: this.id},
res => {
this.loading = false;
if (res.data.resultCode === 1) {
let detail = res.data.data;
console.log(res,'ressssss');
this.dataList = res.data.data;
this.tableData[0].date = res.data.data.name;
this.tableData[0].imgUrl = res.data.data.images.split(',')[0];
this.tableData[0].score = res.data.data.price;
} else {
this.Error(res.data.message);
}
},
null
);
},
//获取积分
getScore(){
this.apiJavaPost('/api/orderForm/getTotalIntegrals',{},res=>{
if(res.data.resultCode==1){
this.score = res.data.data;
}else{
this.Error(res.data.message);
}
});
},
//兑换商品
exchangeGood(){
if(this.score<this.tableData[0].score){
this.Error("积分太少，无法兑换");
return;
}
var msg = {
goodsName:this.tableData[0].date,
goodsPrice:this.tableData[0].score,
goodsImg:this.tableData[0].imgUrl,
shippingAdd:this.OrderAddList[this.addListActive].id,
goodsInfoId:this.id,
buyNum:this.tableData[0].num,
orderTotalPrice:this.tableData[0].num*this.tableData[0].score,
}
this.apiJavaPost('/api/orderForm/confirmOrder',msg,res=>{
if(res.data.resultCode==1){
this.Success(res.data.message);
var dataList = res.data.data;
this.$router.push({
path:'/OrderCompleted',
query:{
// id:this.id,
//payScore:dataList.
}
})
}else{
this.Error(res.data.message);
}
});
}
},
mounted() {
this.getOrderAdd()
this.getOrderAdd();
this.getDetail();
this.getScore();
},created(){
this.id = this.$route.query.id;
this.tableData[0].num = this.$route.query.num;
}
};
</script>
src/components/IntegralMall/myPointOrder.vue 0 → 100644
View file @ 691f5bb9
<style>
.myPointOrder{
background-color: #f5f5f5;
padding-bottom:20px;
}
.myPointOrder .breadcrumb{
padding: 20px 0;
}
.myPointOrder .pd_top_info{
height: 554px;
}
.myPointOrder .myPointer_filter{
width:100%;
height:54px;
border:1px solid #ECECEC;
background-color: #fff;
}
.myPointOrder .myPointer_mainContent{
width:100%;
}
.myPointOrder .myPo_left{
float:left;
width:250px;
font-size:14px;
color:#333333;
margin-left:20px;
}
.myPointOrder .d_tit div{
padding: 17px 0;
border-bottom: 2px solid rgba(0,0,0,0);
cursor: pointer;
width: 70px;
margin: 0 auto;
position: relative;
}
.myPointOrder .d_tit div i{
display: inline-block;
position: absolute;
width:30px;
height:2px;
top:53px;
left:13px;
display: none;
background-color: #DF3343;
}
.myPointOrder .pActive{
color:#DF3343;
}
.myPointOrder .pActive i{
display: block!important;
}
.myPointOrder .myPo_right{
float:right;
margin:15px 20px;
}
.myPointOrder .myPo_right .el-input__inner{
height:25px;
border-radius:0;
}
.myPointOrder .myPo_right .el-input__inner:focus{
border:1px solid #dcdfe6;
}
.myPointOrder .myPo_right .el-input-group__append{
border-radius: 0;
}
.myPointOrder .pro_title{
width:100%;
height:40px;
background-color: #fff;
border:1px solid #EDEDED;
margin-top:20px;
font-size: 12px;
color:#666666;
line-height: 40px;
}
.myPointOrder .pro_title div{
display: inline-block;
}
.myPointOrder .pro_T1{
width:294px;
padding-left:28px;
}
.myPointOrder .pro_T1 .el-dropdown{
cursor: pointer;
}
.myPointOrder .pro_T2{
width:157px;
text-align: center;
}
.myPointOrder .myPointTable{
width: 100%;
border: solid 1px #EDEDED;
border-collapse: collapse;
font-size:14px;
margin:20px 0;
}
.myPointOrder .myPointTable td{
padding:20px 15px;
background-color: #fff;
text-align: center;
color:#333333;
border:1px solid #ECECEC;
font-size:12px;
}
.myPointOrder .myPointTable:hover td{
background-color: #FFF0F0;
}
.myPointOrder .pointOrderTime{
color:#999999;
}
.myPointOrder .pointOrderNum{
color:#333333
}
.myPointOrder .pointOrderTitle{
margin-left:30px;
color:#666666;
}
.myPointOrder .pointDetailBtn{
width:64px;
height:24px;
color:#fff;
outline: none;
border:none;
background-color: #EE4454;
border-radius:4px;
cursor: pointer;
font-size:12px;
}
.myPointOrder .pointCancelBtn{
width:64px;
height:24px;
outline: none;
color:#666666;
background-color: transparent;
border:1px solid rgba(102,102,102,1);
border-radius:4px;
cursor: pointer;
font-size:12px;
}
.myPointOrder .po_info{
display: flex;
align-items: center;
}
.myPointOrder .po_left{
width: 70px;
height: 70px;
background-color: #fff;
margin-right: 10px;
border:1px solid #ECECEC;
display: inline-block;
}
.po_left img{
width:100%;
}
.myPointOrder .po_right{
color: #666666;
font-size: 14px;
display: inline-block;
width: 220px;
text-align: left;
}
.pointFenye{
width:100%;
height:42px;
background-color: #EBEBEB;
text-align: right;
}
/* 分页样式 */
.myPointOrder ._pagination{
height: 45px;
background-color: #EBEBEB;
display: flex;
align-items: center;
justify-content: flex-end;
}
.myPointOrder .el-pagination .btn-next,.myPointOrder .el-pagination .btn-prev{
width:40px !important;
height:20px !important;
border:1px solid rgba(238,68,84,1);
border-radius:10px;
color: #f56c6c;
}
.myPointOrder .el-pagination{
display: flex;
align-items: center;
}
.myPointOrder .el-pager li{
background: transparent;
font-weight: initial;
}
.myPointOrder .el-pager li.active{
color: #f56c6c;
}
.po_hotDetail{
width:224px;
}
.po_hotRight{
width:955px;
margin-left:20px;
}
</style>
<template>
<el-row class="myPointOrder">
<div class="w1200">
<el-row>
<el-breadcrumb separator-class="el-icon-arrow-right" class="breadcrumb">
<el-breadcrumb-item :to="{ path: '/IntegralMall' }">积分商城</el-breadcrumb-item>
<el-breadcrumb-item>我的订单</el-breadcrumb-item>
</el-breadcrumb>
</el-row>
<el-row class="pd_bottom_detail">
<el-col class="po_hotDetail">
<detailsLeftHot/>
</el-col>
<el-col class="po_hotRight">
<el-row>
<div class="myPointer_mainContent">
<div class="myPointer_filter clearfix">
<div class="myPo_left">
<el-row>
<el-col :span="8" class="d_tit">
<div :class="{'pActive':tabActive==1}" @click="tabActive = 1,msg.queType='',getList()">
全部订单
<i class="myPoint_line"></i>
</div>
</el-col>
<el-col :span="8" class="d_tit">
<div :class="{'pActive':tabActive==2}" @click="tabActive = 2,msg.queType=3,getList()">
交易成功
<i class="myPoint_line"></i>
</div>
</el-col>
</el-row>
</div>
<div class="myPo_right">
<el-input placeholder="商品名称/商品编号/订单号" v-model="msg.queName" @keyup.enter.native="getList()" class="input-with-select">
<el-button slot="append" icon="el-icon-search" @click="getList()"></el-button>
</el-input>
</div>
</div>
<div class="pro_title">
<div class="pro_T1">
<el-dropdown trigger="click" @command="handleCommandTwo">
<span class="el-dropdown-link">
{{orderTime}}
<i class="el-icon-arrow-down el-icon--right"></i>
</span>
<el-dropdown-menu slot="dropdown">
<template v-for="item in OrderTimeList">
<el-dropdown-item :command="item">{{item.Day}}</el-dropdown-item>
</template>
</el-dropdown-menu>
</el-dropdown>
</div>
<div class="pro_T2">
<span>订单详情</span>
</div>
<div class="pro_T2">
<span>积分</span>
</div>
<div class="pro_T2">
<span>状态</span>
</div>
<div class="pro_T2">
<span>操作</span>
</div>
</div>
<table class="myPointTable" v-for="item in dataList">
<tr>
<td colspan="5" style="text-align:left;">
<span class="pointOrderTime">{{item.crateTime | YMDHMS}}</span>
<span class="pointOrderTitle">订单号：</span><span class="pointOrderNum">{{item.orderNum}}</span>
</td>
</tr>
<tr>
<td width="320px">
<div class="po_info">
<div class="po_left">
<img :src="item.goodsImg" alt=""/>
</div>
<div class="po_right">
{{item.goodsName}}
</div>
</div>
</td>
<td width="120px">
数量：{{item.buyNum}}
</td>
<td width="150px">
<span style="color:#FF0101">￥{{item.goodsPrice}}</span>
</td>
<td width="150px">
<span v-if="item.orderStatus==1">待发货</span>
<span v-if="item.orderStatus==2">待收货</span>
<span v-if="item.orderStatus==3">交易成功</span>
</td>
<td width="150px">
<input type="button" class="pointDetailBtn" @click="goUrl('OrderdetailsCompleted')" value="查看详情">
<!-- <div><input type="button" class="pointCancelBtn" value="取消订单"></div> -->
</td>
</tr>
</table>
<div class="empty-data" v-if="dataList.length==0">
<i class="iconfont icon-kong"></i>
很抱歉，你想要的信息我们真的找不到了
</div>
<!-- 分页 -->
<el-row class="_pagination" v-if="totalCount > 1 && dataList.length>0">
<el-pagination
:current-page.sync="currentPage"
:page-size="msg.pageSize"
layout="total, prev, pager, next"
:total="Count"
@current-change="handleCurrentChange"
></el-pagination>
</el-row>
</div>
</el-row>
</el-col>
</el-row>
</div>
</el-row>
</template>
<script>
import detailsLeftHot from '@/components/IntegralMall/block/detailsLeftHot'
export default {
components:{
detailsLeftHot
},
data(){
return {
tabActive:2,
currentPage: 1,
totalCount: 0,
orderTime:'近三个月订单',
Count: 1,
msg: {
pageIndex: 1,
pageSize: 5,
queName:'',
queType:3
},
OrderTimeList: [
{
Day: "近四个月订单",
ID: 1
},
{
Day: "近五个月订单",
ID: 2
},
{
Day: "近六个月订单",
ID: 3
}
],
dataList:[]
}
},methods:{
//获取数据
getList(){
this.apiJavaPost('/api/orderForm/orderDetailList',this.msg,res=>{
if(res.data.resultCode==1){
this.dataList = res.data.data.pageData;
this.totalCount = res.data.data.pageCount;
this.Count = res.data.data.count;
}else{
this.Error(res.data.message);
}
},null)
},
handleCurrentChange(val) {
// 翻页
this.msg.pageIndex = parseInt(val);
this.getList();
},
goUrl: function (path) {
this.$router.push({name: path});
},
handleCommandTwo(command) {
this.orderTime = command.Day;
// let queryDays = command.Number;
// this.$emit('queryDays', queryDays)
},
},mounted(){
this.getList();
}
}
</script>
src/components/IntegralMall/productDetail.vue
View file @ 691f5bb9
......@@ -217,7 +217,7 @@
<p><i class="iconfont icon-tixing"></i>这里是相关的一些比较重要一点的提示说明，比如平台的一些简单规则等等。。。</p>
</div>
<div class="_btn_dui">
<span @click="PlacingOrder(1)">立即兑换</span>
<span @click="PlacingOrder()">立即兑换</span>
</div>
</el-col>
</el-row>
......@@ -304,8 +304,8 @@ export default {
null
);
},
PlacingOrder: function (id) {
this.$router.push({name: 'confirOrder', query: { id: id, num: this.numbers}})
PlacingOrder: function () {
this.$router.push({name: 'confirOrder', query: { id: this.id, num: this.numbers}})
}
},mounted(){
this.getDetail()
......
src/components/newPersonalCenter/integral/model/commodity.vue
View file @ 691f5bb9
......@@ -7,7 +7,6 @@
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;
}
......@@ -19,17 +18,23 @@
}
.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;
width:229px;
height:241px;
cursor: pointer;
}
.commodity .small:last-child{
width:230px;
}
.commodity .small img{
max-height: 110px;
margin:15px 0;
}
.commodity .small ._name{
margin: 5px 0 15px 0;
margin: 5px 0 10px 0;
}
.commodity .small ._detais{
color: #999999;
......@@ -51,56 +56,56 @@
.commodity .medium ._detais{
color: #999999;
}
.com_bigImg{
max-width: 357px;
}
.medium{
width:344px;
height:240px;
cursor: pointer;
}
.com_BigDiv{
min-height:480px;border-right:1px solid #ECECEC;
}
.commodity .r_item_img_box{
min-height: 175px;
}
.r_item_btmBox{
min-height: 135px;
}
</style>
<template>
<el-row class="commodity">
<el-col :span="10">
<div class="info">
<el-col :span="10" class="com_BigDiv">
<div @click="goDetail(item.Id)" class="info" v-if="index==0" v-for="(item,index) in message">
<div>
<img src="../../../../assets/img/img-01.png" alt>
<img class="com_bigImg" :src="getImgUrl(message[0].Images)" alt>
</div>
<p class="_name">出行必备物品</p>
<p class="_detais">699积分抢兑</p>
<p class="_name">{{message[0].name}}</p>
<p class="_detais">{{message[0].Price}}积分抢兑</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>
<el-col :span="8" class="small" v-if="index>0&&index<4" v-for="(item,index) in message">
<div @click="goDetail(item.Id)">
<div class="r_item_img_box">
<img :src="getImgUrl(item.Images)" alt>
</div>
<p class="_name">{{item.name}}</p>
<p class="_detais" v-if="item.Price!=''">{{item.Price}}积分抢兑</p>
</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>
<el-col :span="12" class="medium f" v-if="index>3" v-for="(item,index) in message">
<div @click="goDetail(item.Id)">
<div class="r_item_btmBox">
<img :src="getImgUrl(item.Images)" alt>
</div>
<p class="_name">{{item.name}}</p>
<p class="_detais" v-if="item.Price!=''">{{item.Price}}积分抢兑</p>
</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>
......@@ -108,5 +113,24 @@
</template>
<script>
export default {};
export default {
props:["message"],
data(){
return {
}
},methods:{
getImgUrl(imgUrl){
var url= imgUrl.split(",")[0];
return url;
},
//跳转详情页面
goDetail: function (id) {
this.$router.push({ path: 'productDetail', query: {id: id}})
},
},mounted(){
console.log(this.message,'messagess');
}
};
</script>
src/components/newPersonalCenter/integral/model/integralHomeV2.vue
View file @ 691f5bb9
......@@ -108,6 +108,10 @@
color:rgba(255,1,1,1);
margin-top: 12px;
}
.font_bla:hover{
text-decoration: underline;
cursor: pointer;
}
</style>
<template>
......@@ -122,7 +126,7 @@
<img v-else src="../../../../assets/img/head_normal1.png" alt="">
</div>
<p class="_tit">我的积分</p>
<p class="_number">1288</p>
<p class="_number">{{score}}</p>
</el-col>
<el-col :span="20" class="head_ban">
<img src="../../../../assets/img/ps/jifenban.png" alt="">
......@@ -155,7 +159,7 @@
<el-col :span="6">
<div>
<div>
<p class="font_bla">积分商城任你选</p>
<p class="font_bla" @click="goUrl('IntegralMall')">积分商城任你选</p>
<p>大牌随心兑</p>
</div>
<div>
......@@ -166,7 +170,7 @@
<el-col :span="6">
<div>
<div>
<p class="font_bla">我的积分订单</p>
<p class="font_bla" @click="goUrl('myPointOrder')">我的积分订单</p>
<p>会员积分兑</p>
</div>
<div>
......@@ -176,32 +180,15 @@
</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="class" v-for="item in dataList">
<el-row class="tit">
<div>
<img src="../../../../assets/img/ps/jifenli.png" alt="">
<p>999积分享好礼</p>
<!-- <img src="../../../../assets/img/ps/jifenhot.png" alt=""> -->
<img :src="item.activityImg" alt="">
<p>{{item.activityName}}</p>
</div>
</el-row>
<Vcommodity/>
<Vcommodity v-bind:message="item.list"/>
</el-row>
<el-row class="advert" :gutter="20">
<el-col :span="12">
......@@ -247,7 +234,9 @@ export default {
data(){
return{
StorageInfo: {},
list: [1,2,3,4,5,6,7,8,9,10]
list: [1,2,3,4,5,6,7,8,9,10],
dataList:[],
score:0,
}
},
created(){
......@@ -256,9 +245,53 @@ export default {
},methods:{
goExchange: function(){
this.MsgBus.$emit('goCPage', '4-3')
},
goUrl: function (path) {
this.$router.push({name: path});
},
//获取活动分类展示
getActivesList(){
this.apiJavaPost('/api/goodsMarket/getActivityClassifyGoods',{},res=>{
if(res.data.resultCode==1){
this.dataList = res.data.data;
console.log(this.dataList,'sssssss');
var num=0;
this.dataList.forEach(x=>{
if(x.list.length<6){
num=6-x.list.length;
}
var obj = {
Description:'',
Id:'',
Images:'',
Price:'',
activityId:'',
activityImg:'',
activityName:'',
name:''
}
for(var i=0;i<num;i++){
x.list.push(obj);
}
})
}else{
this.Error(res.data.message);
}
},null)
},
//获取积分
getScore(){
this.apiJavaPost('/api/orderForm/getTotalIntegrals',{},res=>{
if(res.data.resultCode==1){
this.score = res.data.data;
}else{
this.Error(res.data.message);
}
});
}
},mounted(){
this.getScore();
this.getActivesList();
}
}
</script>
src/components/newPersonalCenter/newPersonalCenter.vue
View file @ 691f5bb9
......@@ -87,7 +87,7 @@
<span>我的积分</span>
</template>
<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="goUrl('IntegralDetail')">积分明细</el-menu-item>
<el-menu-item index="4-3" @click="clickMenu('4-3')">我的兑换</el-menu-item>
</el-submenu>
<el-menu-item index="5" @click="clickMenu('5')">
......
src/components/taskPage/IceCream/IceCreamTask.vue
View file @ 691f5bb9
......@@ -182,7 +182,9 @@
</div>
</div>
<!-- 我的奖券 -->
<myTicket v-show="myTicketShow" @closeMyWindow="closeMyWindow" name='Ticket'/>
<myTicket v-show="myTicketShow" @closeMyWindow="closeMyWindow" @openList="openList" name='Ticket'/>
<!-- 奖券列表 -->
<ticketList v-show="ticketShow" :ticketId='ticketId' @closeMyWindow="closeMyWindow" />
<!-- 活动说明 -->
<description v-show="descriptionShow" :data="info" @closeMyWindow="closeMyWindow" name='Active'/>
<!-- 全家桶 -->
......@@ -196,19 +198,23 @@ import myTicket from './myTicket'
import description from './description'
import allHome from './allHome'
import raffleTickets from './raffleTickets'
import ticketList from './ticketList'
export default {
components: {
myTicket,
description,
allHome,
raffleTickets
raffleTickets,
ticketList
},
data(){
return{
ticketId: 0,
myTicketShow: false,
descriptionShow: false,
allHomeShow: false,
raffleTicketsShow: true,
ticketShow: false,
info: '瓜分现金作为本次获得的爆点，吸引用户。能领到抽奖券的用户，肯定是已经交过客人，大部分会是交过10个人以上的用户，小概率会有人没有交到10个人的，所以看看能不能做0.88+8.8+18.8+68.8+288的现金红包（68的设定30个以内，288设定1个），其它都是小红包的，交客数量最多的前三随机获得288，前50随机获得68，其他人获得小红包。',
list: [
{
......@@ -234,6 +240,11 @@ export default {
]
}
},methods:{
openList: function (id) {
this.ticketId = id
this.myTicketShow = false
this.ticketShow = true
},
openLayer: function (obj) {
if (obj.id === 2) {
this.myTicketShow = true;
......@@ -248,6 +259,9 @@ export default {
this.allHomeShow = false
} else if (val === 'raffleTickets') {
this.raffleTicketsShow = false
} else if (val === 'ticket') {
this.ticketShow = false
this.myTicketShow = true
}
}
},mounted(){
......
src/components/taskPage/IceCream/myTicket.vue
View file @ 691f5bb9
......@@ -71,7 +71,7 @@
<div class="item_img">
<img :src="item.src" alt="">
</div>
<span class="item_name">{{item.name}}</span>
<span class="item_name" @click="openList(item.id)">{{item.name}}</span>
</div>
</div>
<div @mouseover="closeShow = 1" @mouseout="closeShow = 2" class="myTicket_close" @click="close">
......@@ -123,6 +123,9 @@ export default {
},methods:{
close: function () {
this.$emit('closeMyWindow', 'Ticket')
},
openList: function (id) {
this.$emit('openList', id)
}
},mounted(){
......
src/components/taskPage/IceCream/ticketList.vue 0 → 100644
View file @ 691f5bb9
<style>
.ticketList{
width: 100%;
height: 100%;
background:rgba(0, 0, 0, .5);
position: absolute;
left: 0;
top: 0;
z-index: 2018;
display: flex;
align-items: center;
justify-content: center;
}
.ticketList .ticketList_bg{
height: 538px;
width: 300px;
background: url('../../../assets/img/task/quanlist.png');
background-size: 100% 100%;
position: relative;
}
.ticketList .ticketList_close{
position: absolute;
right: -10px;
top: -10px;
cursor: pointer;
}
.ticketList .ticketList_close img{
width:36px;
height:37px;
}
.ticketList .ticketList_box{
padding: 10px;
}
.ticketList .ticketList_tit{
width:280px;
height:85px;
background:rgba(255,255,255,.68);
border-top-left-radius:21px;
border-top-right-radius:21px;
}
.ticketList .ticketList_tit .top_btn{
display: flex;
justify-content: space-between;
align-items: center;
height: 52px;
padding: 4px 8px 0;
border-bottom:2px dashed rgba(255,148,21,1);
}
.ticketList .ticketList_tit .top_btn img{
width:127px;
height:40px;
cursor: pointer;
}
.ticketList .el-checkbox__inner{
border-radius: 50%;
}
</style>
<template>
<div class="ticketList">
<div class="ticketList_bg">
<div class="ticketList_box">
<div class="ticketList_tit">
<div class="top_btn">
<div>
<img v-if="activeNav === 1" src="../../../assets/img/task/weishiyong2.png" alt="">
<img v-else @click="activeNav = 1" src="../../../assets/img/task/weishiyong.png" alt="">
</div>
<div>
<img v-if="activeNav === 2" src="../../../assets/img/task/yishiyong2.png" alt="">
<img v-else @click="activeNav = 2" src="../../../assets/img/task/yishiyong.png" alt="">
</div>
</div>
<div>
<el-checkbox :indeterminate="isIndeterminate" v-model="checkAll" @change="handleCheckAllChange">全选</el-checkbox>
<span>合并</span>
</div>
</div>
<div>
<el-checkbox-group v-model="checkedCities" @change="handleCheckedCitiesChange">
<el-checkbox v-for="city in cities" :label="city" :key="city">{{city}}</el-checkbox>
</el-checkbox-group>
</div>
</div>
<div @mouseover="closeShow = 1" @mouseout="closeShow = 2" class="ticketList_close" @click="close">
<img v-if="closeShow === 2" src="../../../assets/img/task/close.png" alt="">
<img v-else src="../../../assets/img/task/close2.png" alt="">
</div>
</div>
</div>
</template>
<script>
const cityOptions = ['上海', '北京', '广州', '深圳'];
export default {
props: ['id'],
data() {
return{
closeShow: 1,
activeNav: 1,
heckAll: false,
checkedCities: ['上海', '北京'],
cities: cityOptions,
isIndeterminate: true
}
},methods:{
handleCheckAllChange(val) {
this.checkedCities = val ? cityOptions : [];
this.isIndeterminate = false;
},
handleCheckedCitiesChange(value) {
let checkedCount = value.length;
this.checkAll = checkedCount === this.cities.length;
this.isIndeterminate = checkedCount > 0 && checkedCount < this.cities.length;
},
close: function () {
this.$emit('closeMyWindow', 'ticket')
},
},mounted(){
}
}
</script>
src/main.js
View file @ 691f5bb9
......@@ -137,6 +137,9 @@ Vue.filter("YMD", function (date) {
Vue.filter("MD", function (date) {
return moment(date).format("MM月DD日");
})
Vue.filter("YMDHMS", function (date) {
return moment(date).format("YYYY-MM-DD HH:mm:ss");
})
Vue.prototype.random_string = function (len) {
len = len || 32;
var chars = 'ABCDEFGHJKMNPQRSTWXYZabcdefhijkmnprstwxyz2345678';
......
src/router.js
View file @ 691f5bb9
......@@ -192,6 +192,38 @@ export default new Router({
title: "订单确认-印象之旅~感动与世界同步"
}
},
{
path: "/myPointOrder", //个人中心-我的积分订单
name: "myPointOrder",
component: resolve => require(["@/components/IntegralMall/myPointOrder"], resolve),
meta: {
title: "订单确认-印象之旅~感动与世界同步"
}
},
{
path: "/OrderdetailsCompleted", //个人中心-订单完成详情
name: "OrderdetailsCompleted",
component: resolve => require(["@/components/IntegralMall/OrderdetailsCompleted"], resolve),
meta: {
title: "订单确认-印象之旅~感动与世界同步"
}
},
{
path: "/IntegralDetail", //个人中心-积分明细
name: "IntegralDetail",
component: resolve => require(["@/components/IntegralMall/IntegralDetail"], resolve),
meta: {
title: "订单确认-印象之旅~感动与世界同步"
}
},
{
path: "/OrderCompleted", //个人中心-订单完成
name: "OrderCompleted",
component: resolve => require(["@/components/IntegralMall/OrderCompleted"], resolve),
meta: {
title: "订单确认-印象之旅~感动与世界同步"
}
},
{
path: "/integral",
name: "integral",
......
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