fe / yohoblk-wap · Commits

Go to a project

Authored by 沈志敏
Commit 1aa5c4ec06cf760e665fbe9b7e6cd3f8eacce344 1 parent 5b209508

fix bug

Inline Side-by-side
Showing 4 changed files with 85 additions and 89 deletions
... ... @@ -65,7 +65,7 @@ const applySuccuss = function(type, applyId) {
const modal = new Modal({
styleClass: 'return-success-modal',
text: `${kind.name}申请已提交,请等待审核.....`,
title: `${kind.name}申请已提交,请等待审核.....`,
buttons: [{
text: '返回订单',
handler: function() {
... ...
... ... @@ -43,6 +43,7 @@
color: #4a90e2;
font-size: 30px;
line-height: 88px;
font-weight: bold;
}
a.modal-button:first-of-type {
... ...
... ... @@ -22,7 +22,7 @@
}
.item-del {
margin-top: 10px;
margin-top: 20px;
border-top: 1px solid #e0e0e0;
color: #5c99e4;
}
... ...
<template>
<div class="logistic-page yoho-page">
<div class="overview">
<div class="left" >
<a href="{{logisticDate.url}}">
<img class="icon" v-bind:src="logo | resize 88 88" />
</a>
</div>
<div class="right">
<div>
<span class='info'>物流公司:</span>
<span >{{logisticDate.caption}}</span>
</div>
<div>
<span class='info'>快递单号:</span>
<span>{{logisticDate.express_number}}</span>
<div class="logistic-page yoho-page">
<div class="overview">
<div class="left" >
<img class="logoicon" v-bind:src="logo | resize 90 90" />
</div>
</div>
</div><!--end overview-->
<div class="title">
<span>物流详情</span>
</div>
<div class="detail">
<div class="timeline-box" v-for="(index, detail) in logisticDate.express_detail">
<span class="timeline-node"></span>
<div class="timeline-info">
<div class="timeline-info-row">
{{detail.accept_address}}
<div class="right">
<div>
<span class='info'>物流公司:</span>
<span >{{logisticDate.caption}}</span>
</div>
<div class="timeline-info-row">
{{detail.acceptTime}}
<div>
<span class='info'>快递单号:</span>
<span>{{logisticDate.express_number}}</span>
</div>
</div>
</div><!--end overview-->
<div class="title">
<span>物流详情</span>
</div>
</div><!--end detail-->
</div><!--end logistic-page-->
<div class="detail">
<div class="timeline-box" v-for="(index, detail) in logisticDate.express_detail">
<span class="timeline-node"></span>
<div class="timeline-info">
<div class="timeline-info-row">
{{detail.accept_address}}
</div>
<div class="timeline-info-row time">
{{detail.acceptTime}}
</div>
</div>
</div>
</div><!--end detail-->
</div><!--end logistic-page-->
</template>
<style>
$logistic_gray: #f0f0f0;
$border_color_strong: #e5e5e5;
$border_color_light: #eee;
.logistic-page {
background-color: $logistic_gray;
.overview {
height: 120px;
height: 150px;
line-height: 120px;
width: 100%;
margin-bottom: 40px;
margin-bottom: 20px;
background-color: #fff;
color: #464646;
border-bottom: 1px solid $border_color_strong;
border-bottom: 1px solid $border_color_light;
.left {
width: 19%;
width: 150px;
float: left;
text-align: center;
height: 100%;
.icon {
width: 88px;
height: 88px;
.logoicon {
width: 90px;
height: 90px;
margin: 0 auto;
background-size: 100%;
background-repeat: no-repeat;
background-position: center;
margin-top: 16px;
margin-top: 30px;
}
}
.right {
width: 81%;
width: 600px;
height: 100%;
float: left;
padding-top: 20px;
padding-bottom: 20px;
height: 80px;
padding: 36px 0;
div {
height: 40px;
line-height: 44px;
color: #595959;
font-size: 24px;
}
}
.info {
padding-right: 4px;
color: #b0b0b0;
}
}
.title {
height: 112px;
line-height: 112px;
height: 88px;
line-height: 89px;
background-color: #fff;
padding-left: 40px;
font-size: 40px;
padding-left: 30px;
font-size: 34px;
}
.detail {
background-color: #fff;
padding-left: 80px;
padding-left: 42px;
margin-bottom: 40px;
}
.timeline-box {
border-left: 1px solid $border_color_strong;
border-left: 1px solid $border_color_light;
position: relative;
padding-left: 52px;
padding-left: 42px;
height: 116px;
}
.timeline-node {
... ... @@ -118,25 +111,31 @@ $border_color_light: #eee;
top: 32px;
left: -9.04444px;
display: inline-block;
width: 16.4px;
height: 16.4px;
background-color: $border_color_strong;
width: 16px;
height: 16px;
background-color: #b0b0b0;
border-radius: 100%;
}
.timeline-box:first-child {
.timeline-node {
background-color: #989898;
background-color: #000;
width: 22px;
height: 22px;
}
.timeline-info-row {
color: #606060;
color: #000;
}
.time {
color: #b0b0b0;
}
}
.timeline-info {
padding: 20px 0;
border-bottom: 1px solid $border_color_strong;
border-bottom: 1px solid $border_color_light;
}
.timeline-box:last-child {
... ... @@ -149,49 +148,45 @@ $border_color_light: #eee;
min-height: 40px;
line-height: 40px;
font-size: 28px;
color: #bababa;
color: #b0b0b0;
padding-right: 32px;
}
.time {
font-size: 24px;
}
}
</style>
<script>
const $ = require('jquery');
const qs = require('yoho-qs');
const tip = require('common/tip');
module.exports = {
props: [],
data() {
return {
logisticDate: [],
logo: ''
};
},
methods: {
getLogisticDate() {
let data = {
orderCode: qs.order_code || '',
type: qs.type || '',
id: qs.id || ''
};
$.ajax({
url: '/me/get-order-logistic-date',
data: data
}).then(result => {
this.logisticDate = result;
if (result && result.logo) {
this.logo = result.logo;
}
}).fail(() => {
tip('网络错误');
});
}
},
created() {
this.getLogisticDate();
const data = {
orderCode: qs.order_code || '',
type: qs.type || '',
id: qs.id || ''
};
$.ajax({
url: '/me/get-order-logistic-date',
data: data
}).then(result => {
this.logisticDate = result;
if (result && result.logo) {
this.logo = result.logo;
}
}).fail(() => {
tip('网络错误');
});
}
};
</script>
... ...