item.vue
2.17 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
<template>
<div class="return-form exchange-form">
<product :product="product"></product>
<reason :product="product">
<span slot="type">换货原因</span>
</reason>
<div class="field" @click="openFeatureSelector(product)">
换货的颜色尺码
<div class="right">
<span class="change" v-if="product.change">颜色:{{product.change.color}} 尺码:{{product.change.size}}</span>
<span class="change" v-else>请选择</span>
<i class="icon icon-right"></i>
</div>
</div>
</div>
</template>
<script>
/**
* exchange form
* 1. 产品信息
* 2. 更换产品 款式
* 3. 换货 原因
*/
const product = require('home/return/item.vue');
const reason = require('home/return/reason.vue');
const bus = require('plugin/vue-bus');
module.exports = {
props: {
product: Object,
readyonly: Boolean,
reasons: Array,
specialReason: Array
},
components: {
product,
reason
},
methods: {
openFeatureSelector(info) {
bus.$emit('open.featureSelector', {
pid: info.product_id,
rid: info.reason.id,
sku: info.productSku,
uid: this._uid
});
}
}
};
</script>
<style>
.return-form {
.reason:after {
position: absolute;
z-index: 1;
content: "";
display: block;
height: 0;
right: 30px;
left: 30px;
border-bottom: 1px solid #eee;
}
.field {
position: relative;
height: 90px;
line-height: 90px;
padding: 0 30px;
background-color: #fff;
font-size: 32px;
margin-bottom: 30px;
}
.field .right {
color: #b0b0b0;
float: right;
}
.change {
display: inline-block;
margin-right: 14px;
}
}
</style>