Commit 697c1032cd8689d4627c3ec26fec5ed8c558930e
1 parent
0444517bf0
Exists in
master
设置git区分文件名大小写
Showing
3 changed files
with
304 additions
and
151 deletions
Show diff stats
src/pages/Predelivery/Predelivery.vue
| ... | ... | @@ -1,151 +0,0 @@ |
| 1 | -<template> | |
| 2 | - <view class="container"> | |
| 3 | - <view v-for="(items) in form" :key="items.key" class="order"> | |
| 4 | - <view class="order_number">订单号：{{items.orderNum}}<span>待发货</span></view> | |
| 5 | - <view class="order_detail"> | |
| 6 | - <view class="detail_img"><image v-bind:src="items.img"></image></view> | |
| 7 | - <view class="detail_zi"> | |
| 8 | - <view class="zi_name">{{items.name}}</view> | |
| 9 | - <view class="zi_standard">规格：{{items.standard}}</view> | |
| 10 | - <view class="zi_preprice">￥{{items.preprice}}<span>X{{items.number}}</span></view> | |
| 11 | - </view> | |
| 12 | - </view> | |
| 13 | - <view class="now_price">实付：<span>￥{{items.nowprice}}</span></view> | |
| 14 | - <view class="clear"></view> | |
| 15 | - <view class="button"> | |
| 16 | - <view class="button1">申请退款</view> | |
| 17 | - <view class="button2">提醒发货</view> | |
| 18 | - </view> | |
| 19 | - </view> | |
| 20 | - </view> | |
| 21 | -</template> | |
| 22 | - | |
| 23 | -<script> | |
| 24 | -export default { | |
| 25 | - data(){ | |
| 26 | - return{ | |
| 27 | - form:[ | |
| 28 | - { | |
| 29 | - key: 0, | |
| 30 | - name:'商品名称', | |
| 31 | - standard:'玫瑰金/钛合金/防日光防紫外线/超薄超轻', | |
| 32 | - img: '/static/img/detail/delivery.png', | |
| 33 | - preprice: 180, | |
| 34 | - number:1, | |
| 35 | - orderNum: 2034867958596334, | |
| 36 | - nowprice: 110, | |
| 37 | - } | |
| 38 | - ] | |
| 39 | - | |
| 40 | - } | |
| 41 | - } | |
| 42 | -} | |
| 43 | -</script> | |
| 44 | - | |
| 45 | -<style lang="scss"> | |
| 46 | -.container{ | |
| 47 | - width: 100%; | |
| 48 | - height: 100%; | |
| 49 | - background: #F2F2F2; | |
| 50 | - height: 700px; | |
| 51 | - //要获取屏幕大小 | |
| 52 | -} | |
| 53 | -.order{ | |
| 54 | - background: #FFFFFF; | |
| 55 | - width: 90%; | |
| 56 | - height: 450rpx; | |
| 57 | - margin: 0 auto; | |
| 58 | - padding: 40rpx; | |
| 59 | - box-sizing: border-box; | |
| 60 | - border-radius: 5px; | |
| 61 | -} | |
| 62 | -.order_number{ | |
| 63 | - color: #999999; | |
| 64 | - font-size: 12px; | |
| 65 | - font-family: "PingFangSC-Regular"; | |
| 66 | - span{ | |
| 67 | - font-family: PingFangSC-Regular; | |
| 68 | - font-size: 14px; | |
| 69 | - color: #FF6B4A; | |
| 70 | - letter-spacing: -0.26px; | |
| 71 | - line-height: 18px; | |
| 72 | - float: right; | |
| 73 | - } | |
| 74 | -} | |
| 75 | -.order_detail{ | |
| 76 | - display: flex; | |
| 77 | - justify-content: space-around; | |
| 78 | - margin-top: 12px; | |
| 79 | -} | |
| 80 | -.detail_img image{ | |
| 81 | - width: 188rpx; | |
| 82 | - height: 188rpx; | |
| 83 | -} | |
| 84 | -.detail_zi{ | |
| 85 | - font-family: PingFangSC-Regular; | |
| 86 | - width: 55%; | |
| 87 | - height: 100%; | |
| 88 | - view{ | |
| 89 | - margin-bottom: 20rpx; | |
| 90 | - } | |
| 91 | - .zi_name{ | |
| 92 | - font-size: 14px; | |
| 93 | - color: #333333; | |
| 94 | - letter-spacing: -0.26px; | |
| 95 | - line-height: 18px; | |
| 96 | - } | |
| 97 | - .zi_standard{ | |
| 98 | - font-size: 12px; | |
| 99 | - color: #999999 ; | |
| 100 | - } | |
| 101 | - .zi_preprice{ | |
| 102 | - font-size: 14px; | |
| 103 | - color: #FF6B4A; | |
| 104 | - span{ | |
| 105 | - float: right; | |
| 106 | - font-size: 12px; | |
| 107 | - color: #999999; | |
| 108 | - } | |
| 109 | - } | |
| 110 | -} | |
| 111 | -.now_price{ | |
| 112 | - font-size: 14px; | |
| 113 | - color: #333333; | |
| 114 | - float: right; | |
| 115 | - span{ | |
| 116 | - font-size: 14px; | |
| 117 | - color: #FF6B4A ; | |
| 118 | - } | |
| 119 | -} | |
| 120 | -.clear{ | |
| 121 | - clear: both; | |
| 122 | -} | |
| 123 | -.button{ | |
| 124 | - display: flex; | |
| 125 | - justify-content: flex-end; | |
| 126 | - margin-top: 14px; | |
| 127 | - view{ | |
| 128 | - width: 156rpx; | |
| 129 | - height: 48rpx; | |
| 130 | - border-radius: 12px; | |
| 131 | - font-size: 12px; | |
| 132 | - text-align: center; | |
| 133 | - line-height: 20px; | |
| 134 | - } | |
| 135 | - .button1{ | |
| 136 | - border: 1px solid #FF6B4A; | |
| 137 | - font-family: PingFangSC-Regular; | |
| 138 | - color: #FF6B4A; | |
| 139 | - letter-spacing: -0.23px; | |
| 140 | - margin-right: 30rpx; | |
| 141 | - } | |
| 142 | - .button2{ | |
| 143 | - border: 1px solid #FF6B4A; | |
| 144 | - background: #FF6B4A; | |
| 145 | - font-family: PingFangSC-Regular; | |
| 146 | - color: #FFFFFF; | |
| 147 | - letter-spacing: -0.23px; | |
| 148 | - | |
| 149 | - } | |
| 150 | -} | |
| 151 | -</style> | |
| 152 | 0 | \ No newline at end of file |
src/pages/predelivery/predelivery.vue
| ... | ... | @@ -0,0 +1,152 @@ |
| 1 | +<template> | |
| 2 | + <view class="container"> | |
| 3 | + <view v-for="(items) in form" :key="items.key" class="order"> | |
| 4 | + <view class="order_number">订单号：{{items.orderNum}}<span>待发货</span></view> | |
| 5 | + <view class="order_detail"> | |
| 6 | + <view class="detail_img"><image v-bind:src="items.img"></image></view> | |
| 7 | + <view class="detail_zi"> | |
| 8 | + <view class="zi_name">{{items.name}}</view> | |
| 9 | + <view class="zi_standard">规格：{{items.standard}}</view> | |
| 10 | + <view class="zi_preprice">￥{{items.preprice}}<span>X{{items.number}}</span></view> | |
| 11 | + </view> | |
| 12 | + </view> | |
| 13 | + <view class="now_price">实付：<span>￥{{items.nowprice}}</span></view> | |
| 14 | + <view class="clear"></view> | |
| 15 | + <view class="button"> | |
| 16 | + <view class="button1">申请退款</view> | |
| 17 | + <view class="button2">提醒发货</view> | |
| 18 | + </view> | |
| 19 | + </view> | |
| 20 | + </view> | |
| 21 | +</template> | |
| 22 | + | |
| 23 | +<script> | |
| 24 | +export default { | |
| 25 | + data(){ | |
| 26 | + return{ | |
| 27 | + form:[ | |
| 28 | + { | |
| 29 | + key: 0, | |
| 30 | + name:'商品名称', | |
| 31 | + standard:'玫瑰金/钛合金/防日光防紫外线/超薄超轻', | |
| 32 | + img: '/static/img/detail/delivery.png', | |
| 33 | + preprice: 180, | |
| 34 | + number:1, | |
| 35 | + orderNum: 2034867958596334, | |
| 36 | + nowprice: 110, | |
| 37 | + } | |
| 38 | + ] | |
| 39 | + | |
| 40 | + } | |
| 41 | + } | |
| 42 | +} | |
| 43 | +</script> | |
| 44 | + | |
| 45 | +<style lang="scss"> | |
| 46 | +.container{ | |
| 47 | + width: 100%; | |
| 48 | + height: 100%; | |
| 49 | + background: #F2F2F2; | |
| 50 | + height: 700px; | |
| 51 | + //要获取屏幕大小 | |
| 52 | +} | |
| 53 | + | |
| 54 | +.order{ | |
| 55 | + background: #FFFFFF; | |
| 56 | + width: 90%; | |
| 57 | + height: 450rpx; | |
| 58 | + margin: 0 auto; | |
| 59 | + padding: 40rpx; | |
| 60 | + box-sizing: border-box; | |
| 61 | + border-radius: 5px; | |
| 62 | +} | |
| 63 | +.order_number{ | |
| 64 | + color: #999999; | |
| 65 | + font-size: 12px; | |
| 66 | + font-family: "PingFangSC-Regular"; | |
| 67 | + span{ | |
| 68 | + font-family: PingFangSC-Regular; | |
| 69 | + font-size: 14px; | |
| 70 | + color: #FF6B4A; | |
| 71 | + letter-spacing: -0.26px; | |
| 72 | + line-height: 18px; | |
| 73 | + float: right; | |
| 74 | + } | |
| 75 | +} | |
| 76 | +.order_detail{ | |
| 77 | + display: flex; | |
| 78 | + justify-content: space-around; | |
| 79 | + margin-top: 12px; | |
| 80 | +} | |
| 81 | +.detail_img image{ | |
| 82 | + width: 188rpx; | |
| 83 | + height: 188rpx; | |
| 84 | +} | |
| 85 | +.detail_zi{ | |
| 86 | + font-family: PingFangSC-Regular; | |
| 87 | + width: 55%; | |
| 88 | + height: 100%; | |
| 89 | + view{ | |
| 90 | + margin-bottom: 20rpx; | |
| 91 | + } | |
| 92 | + .zi_name{ | |
| 93 | + font-size: 14px; | |
| 94 | + color: #333333; | |
| 95 | + letter-spacing: -0.26px; | |
| 96 | + line-height: 18px; | |
| 97 | + } | |
| 98 | + .zi_standard{ | |
| 99 | + font-size: 12px; | |
| 100 | + color: #999999 ; | |
| 101 | + } | |
| 102 | + .zi_preprice{ | |
| 103 | + font-size: 14px; | |
| 104 | + color: #FF6B4A; | |
| 105 | + span{ | |
| 106 | + float: right; | |
| 107 | + font-size: 12px; | |
| 108 | + color: #999999; | |
| 109 | + } | |
| 110 | + } | |
| 111 | +} | |
| 112 | +.now_price{ | |
| 113 | + font-size: 14px; | |
| 114 | + color: #333333; | |
| 115 | + float: right; | |
| 116 | + span{ | |
| 117 | + font-size: 14px; | |
| 118 | + color: #FF6B4A ; | |
| 119 | + } | |
| 120 | +} | |
| 121 | +.clear{ | |
| 122 | + clear: both; | |
| 123 | +} | |
| 124 | +.button{ | |
| 125 | + display: flex; | |
| 126 | + justify-content: flex-end; | |
| 127 | + margin-top: 14px; | |
| 128 | + view{ | |
| 129 | + width: 156rpx; | |
| 130 | + height: 48rpx; | |
| 131 | + border-radius: 12px; | |
| 132 | + font-size: 12px; | |
| 133 | + text-align: center; | |
| 134 | + line-height: 20px; | |
| 135 | + } | |
| 136 | + .button1{ | |
| 137 | + border: 1px solid #FF6B4A; | |
| 138 | + font-family: PingFangSC-Regular; | |
| 139 | + color: #FF6B4A; | |
| 140 | + letter-spacing: -0.23px; | |
| 141 | + margin-right: 30rpx; | |
| 142 | + } | |
| 143 | + .button2{ | |
| 144 | + border: 1px solid #FF6B4A; | |
| 145 | + background: #FF6B4A; | |
| 146 | + font-family: PingFangSC-Regular; | |
| 147 | + color: #FFFFFF; | |
| 148 | + letter-spacing: -0.23px; | |
| 149 | + | |
| 150 | + } | |
| 151 | +} | |
| 152 | +</style> | |
| 0 | 153 | \ No newline at end of file | ... | ... |
src/pages/refundment/refundWays.vue
| ... | ... | @@ -0,0 +1,152 @@ |
| 1 | +<template> | |
| 2 | + <view class="container" v-bind:style="{height: curheight+'px'}"> | |
| 3 | + <view class="refund" v-for="(items) in refund" :key="items.key"> | |
| 4 | + <view class="detail"> | |
| 5 | + <view class="detail_img"><image v-bind:src="items.img"></image></view> | |
| 6 | + <view class="detail2"> | |
| 7 | + <view class="detail_name">{{items.name}}</view> | |
| 8 | + <view class="detail_standard">规格：{{items.standard}}</view> | |
| 9 | + <view class="detail_price"> | |
| 10 | + <span>￥{{items.price}}</span> | |
| 11 | + <span>X{{items.number}}</span> | |
| 12 | + </view> | |
| 13 | + </view> | |
| 14 | + </view> | |
| 15 | + <view class="refund_price"> | |
| 16 | + <span class="refund_price1">退款金额</span> | |
| 17 | + <span class="refund_price2">￥{{items.refundprice}}</span> | |
| 18 | + </view> | |
| 19 | + <view class="refund_reason"> | |
| 20 | + <view>仅退款<image src="/static/img/detail/xiala.png"></image></view> | |
| 21 | + </view> | |
| 22 | + <view class="refund_reason"> | |
| 23 | + <view>退款退货<image src="/static/img/detail/xiala.png"></image></view> | |
| 24 | + </view> | |
| 25 | + <view class="refund_reason"> | |
| 26 | + <view>换货<image src="/static/img/detail/xiala.png"></image></view> | |
| 27 | + </view> | |
| 28 | + </view> | |
| 29 | + </view> | |
| 30 | +</template> | |
| 31 | + | |
| 32 | +<script> | |
| 33 | +export default { | |
| 34 | + //获取浏览器高度 | |
| 35 | + beforeMount(height){ | |
| 36 | + var h = document.documentElement.clientHeight || document.body.clientHeight; | |
| 37 | + this.curheight = h-44; | |
| 38 | + | |
| 39 | + }, | |
| 40 | + data(){ | |
| 41 | + return{ | |
| 42 | + curheight:0, //浏览器高度 | |
| 43 | + refund:[ | |
| 44 | + { | |
| 45 | + key:0, | |
| 46 | + img:'/static/img/detail/d1.png', | |
| 47 | + name:'商品名称', | |
| 48 | + standard:'玫瑰金/钛合金/防日光防紫外线/超薄超轻', | |
| 49 | + price: 180, | |
| 50 | + number: 1, | |
| 51 | + refundprice: 110, | |
| 52 | + refund_img:'/static/img/detail/refund_img.png', | |
| 53 | + } | |
| 54 | + ], | |
| 55 | + } | |
| 56 | + } | |
| 57 | +} | |
| 58 | +</script> | |
| 59 | + | |
| 60 | +<style lang="scss"> | |
| 61 | + | |
| 62 | +.container{ | |
| 63 | + background: #F2F2F2; | |
| 64 | + padding-top: 10px; | |
| 65 | + box-sizing: border-box; | |
| 66 | +} | |
| 67 | +.refund{ | |
| 68 | + width: 90%; | |
| 69 | + height: 300px; | |
| 70 | + margin: 0 auto; | |
| 71 | + background: #FFFFFF; | |
| 72 | + box-shadow: 0 0 10px 0 rgba(177,128,128,0.06); | |
| 73 | + border-radius: 8px; | |
| 74 | + padding: 14px; | |
| 75 | + box-sizing: border-box; | |
| 76 | +} | |
| 77 | +.detail{ | |
| 78 | + display: flex; | |
| 79 | + justify-content: space-between; | |
| 80 | + font-family: PingFangSC-Regular; | |
| 81 | + margin-bottom: 20px; | |
| 82 | + .detail2{ | |
| 83 | + width: 64%; | |
| 84 | + view{ | |
| 85 | + margin-bottom: 8px; | |
| 86 | + } | |
| 87 | + .detail_name{ | |
| 88 | + font-size: 14px; | |
| 89 | + color:#333333; | |
| 90 | + } | |
| 91 | + .detail_standard{ | |
| 92 | + font-size: 12px; | |
| 93 | + color: #999999; | |
| 94 | + } | |
| 95 | + .detail_price{ | |
| 96 | + font-size: 14px; | |
| 97 | + color: #999999; | |
| 98 | + display: flex; | |
| 99 | + justify-content: space-between; | |
| 100 | + } | |
| 101 | + } | |
| 102 | + .detail_img{ | |
| 103 | + width: 188rpx; | |
| 104 | + height: 188rpx; | |
| 105 | + border-radius: 40px; | |
| 106 | + image{ | |
| 107 | + width: 100%; | |
| 108 | + height: 100%; | |
| 109 | + } | |
| 110 | + } | |
| 111 | +} | |
| 112 | + | |
| 113 | +.refund_price{ | |
| 114 | + font-family: PingFangSC-Semibold; | |
| 115 | + font-size: 14px; | |
| 116 | + color: #333333; | |
| 117 | + letter-spacing: -0.26px; | |
| 118 | + line-height: 18px; | |
| 119 | + margin-bottom: 26px; | |
| 120 | + .refund_price1{ | |
| 121 | + font-weight: bold; | |
| 122 | + margin-right: 16px; | |
| 123 | + } | |
| 124 | + .refund_price2{ | |
| 125 | + color: #FF6B4A; | |
| 126 | + } | |
| 127 | +} | |
| 128 | +.refund_reason{ | |
| 129 | + margin-top: 16px; | |
| 130 | + margin-bottom: 16px; | |
| 131 | + font-family: PingFangSC-Regular; | |
| 132 | + font-size: 12px; | |
| 133 | + color: #333333; | |
| 134 | + letter-spacing: -0.23px; | |
| 135 | + line-height: 18px; | |
| 136 | + view{ | |
| 137 | + display: inline-block; | |
| 138 | + font-size: 12px; | |
| 139 | + color: #333333; | |
| 140 | + letter-spacing: -0.23px; | |
| 141 | + line-height: 18px; | |
| 142 | + width: 90%; | |
| 143 | + image{ | |
| 144 | + width: 30rpx; | |
| 145 | + height: 24rpx; | |
| 146 | + float: right; | |
| 147 | + } | |
| 148 | + } | |
| 149 | +} | |
| 150 | + | |
| 151 | + | |
| 152 | +</style> | |
| 0 | 153 | \ No newline at end of file | ... | ... |