Commit bbdb26d05a9b471b506e374dadc0236fa5d5c0eb

Authored by Adam
1 parent 0444517bf0
Exists in master

s

1 { 1 {
2 "pages": [ 2 "pages": [
3 { 3 {
4 "path": "pages/cart/cart", 4 "path": "pages/cart/cart",
5 "style": { 5 "style": {
6 "navigationBarTitleText": "购物车" 6 "navigationBarTitleText": "购物车"
7 } 7 }
8 }, 8 },
9 { 9 {
10 "path": "pages/index/index", 10 "path": "pages/index/index",
11 "style": { 11 "style": {
12 "navigationBarTitleText": "商城一览" 12 "navigationBarTitleText": "商城一览"
13 } 13 }
14 }, 14 },
15 { 15 {
16 "path": "pages/frameDetail/frameDetail", 16 "path": "pages/frameDetail/frameDetail",
17 "style": { 17 "style": {
18 "navigationBarTitleText": "产品详情" 18 "navigationBarTitleText": "产品详情"
19 } 19 }
20 }, 20 },
21 { 21 {
22 "path": "pages/lensDetails/lensDetails", 22 "path": "pages/lensDetails/lensDetails",
23 "style": { 23 "style": {
24 "navigationBarTitleText": "产品详情" 24 "navigationBarTitleText": "产品详情"
25 } 25 }
26 }, 26 },
27 { 27 {
28 "path" : "pages/purchaseLenses/purchaseLenses", 28 "path": "pages/purchaseLenses/purchaseLenses",
29 "style" : { 29 "style": {
30 "navigationBarTitleText": "产品选购" 30 "navigationBarTitleText": "产品选购"
31 } 31 }
32 }, 32 },
33 { 33 {
34 "path" : "pages/refundProgress/refundProgress", 34 "path": "pages/refundProgress/refundProgress",
35 "style": { 35 "style": {
36 "navigationBarTitleText": "申请退款" 36 "navigationBarTitleText": "申请退款"
37 } 37 }
38 }, 38 },
39 { 39 {
40 "path" : "pages/myOrder/myOrder", 40 "path": "pages/myOrder/myOrder",
41 "style" : { 41 "style": {
42 "navigationBarTitleText": "我的订单"} 42 "navigationBarTitleText": "我的订单"
43 }, 43 }
44 },
44 { 45 {
45 "path": "pages/addAddress/addAddress", 46 "path": "pages/addAddress/addAddress",
46 "style": { 47 "style": {
47 "navigationBarTitleText": "新增地址" 48 "navigationBarTitleText": "新增地址"
48 } 49 }
49 }, 50 },
50 { 51 {
51 "path" : "pages/confirmOrder/confirmOrder", 52 "path": "pages/confirmOrder/confirmOrder",
52 "style" : { 53 "style": {
53 "navigationBarTitleText": "确认订单"} 54 "navigationBarTitleText": "确认订单"
54 }, 55 }
56 },
55 { 57 {
56 "path": "pages/user/user", 58 "path": "pages/user/user",
57 "style": { 59 "style": {
58 "navigationBarTitleText": "我的" 60 "navigationBarTitleText": "我的"
59 } 61 }
60 }, 62 },
61 { 63 {
62 "path": "pages/refundment/refundWays" 64 "path": "pages/refundment/refundWays"
63 }, 65 },
64 { 66 {
65 "path": "pages/refundment/refundment" 67 "path": "pages/refundment/refundment"
66 }, 68 },
67 { 69 {
68 "path": "pages/predelivery/predelivery" 70 "path": "pages/Predelivery/Predelivery"
69 }, 71 },
70 { 72 {
71 "path": "pages/customerService/customerService" 73 "path": "pages/customerService/customerService"
72 }, 74 },
73 { 75 {
74 "path": "pages/myOrderPaying/myOrderPaying" 76 "path": "pages/myOrderPaying/myOrderPaying"
75 } 77 }
76 78 ],
77 ],
78 "globalStyle": { 79 "globalStyle": {
79 "navigationBarTextStyle": "black", 80 "navigationBarTextStyle": "black",
80 "navigationBarTitleText": "uni-app", 81 "navigationBarTitleText": "uni-app",
81 "navigationBarBackgroundColor": "#F8F8F8", 82 "navigationBarBackgroundColor": "#F8F8F8",
82 "backgroundColor": "#F8F8F8" 83 "backgroundColor": "#F8F8F8"
83 }, 84 },
84 "tabBar": { 85 "tabBar": {
85 "color": "#C0C4CC", 86 "color": "#C0C4CC",
86 "selectedColor": "#fa436a", 87 "selectedColor": "#fa436a",
87 "borderStyle": "black", 88 "borderStyle": "black",
88 "backgroundColor": "#ffffff", 89 "backgroundColor": "#ffffff",
89 "list": [{ 90 "list": [
91 {
90 "pagePath": "pages/index/index", 92 "pagePath": "pages/index/index",
91 "iconPath": "static/tab-home.png", 93 "iconPath": "static/tab-home.png",
92 "selectedIconPath": "static/tab-home-current.png", 94 "selectedIconPath": "static/tab-home-current.png",
93 "text": "首页" 95 "text": "首页"
94 }, 96 },
95 { 97 {
96 "pagePath": "pages/cart/cart", 98 "pagePath": "pages/cart/cart",
97 "iconPath": "static/tab-cart.png", 99 "iconPath": "static/tab-cart.png",
98 "selectedIconPath": "static/tab-cart-current.png", 100 "selectedIconPath": "static/tab-cart-current.png",
99 "text": "购物车" 101 "text": "购物车"
100 }, 102 },
101 { 103 {
102 "pagePath": "pages/user/user", 104 "pagePath": "pages/user/user",
103 "iconPath": "static/tab-my.png", 105 "iconPath": "static/tab-my.png",
104 "selectedIconPath": "static/tab-my-current.png", 106 "selectedIconPath": "static/tab-my-current.png",
105 "text": "我的" 107 "text": "我的"
106 } 108 }
107 ] 109 ]
108 } 110 }
src/pages/refundment/Refundways.vue
1 <template> 1 <template>
2 <view class="container" v-bind:style="{height: curheight+'px'}"> 2 <view
3 <view class="refund" v-for="(items) in refund" :key="items.key"> 3 class="container"
4 <view class="detail"> 4 v-bind:style="{height: curheight+'px'}"
5 <view class="detail_img"><image v-bind:src="items.img"></image></view> 5 >
6 <view class="detail2"> 6 <view
7 <view class="detail_name">{{items.name}}</view> 7 class="refund"
8 <view class="detail_standard">规格:{{items.standard}}</view> 8 v-for="(items) in refund"
9 <view class="detail_price"> 9 :key="items.key"
10 <span>¥{{items.price}}</span> 10 >
11 <span>X{{items.number}}</span> 11 <view class="detail">
12 </view> 12 <view class="detail_img">
13 </view> 13 <image v-bind:src="items.img"></image>
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> 14 </view>
15 <view class="detail2">
16 <view class="detail_name">{{items.name}}</view>
17 <view class="detail_standard">规格:{{items.standard}}</view>
18 <view class="detail_price">
19 <span>¥{{items.price}}</span>
20 <span>X{{items.number}}</span>
21 </view>
22 </view>
23 </view>
24 <view class="refund_price">
25 <span class="refund_price1">退款金额</span>
26 <span class="refund_price2">¥{{items.refundprice}}</span>
27 </view>
28 <view class="refund_reason">
29 <view>仅退款<image src="/static/img/detail/xiala.png"></image>
30 </view>
31 </view>
32 <view class="refund_reason">
33 <view>退款退货<image src="/static/img/detail/xiala.png"></image>
34 </view>
35 </view>
36 <view class="refund_reason">
37 <view>换货<image src="/static/img/detail/xiala.png"></image>
38 </view>
39 </view>
29 </view> 40 </view>
41 </view>
30 </template> 42 </template>
31 43
32 <script> 44 <script>
33 export default { 45 export default {
34 //获取浏览器高度 46 //获取浏览器高度
35 beforeMount(height){ 47 beforeMount(height) {
36 var h = document.documentElement.clientHeight || document.body.clientHeight; 48 var h = document.documentElement.clientHeight || document.body.clientHeight;
37 this.curheight = h-44; 49 this.curheight = h - 44;
38 50 },
39 }, 51 data() {
40 data(){ 52 return {
41 return{ 53 curheight: 0, //浏览器高度
42 curheight:0, //浏览器高度 54 refund: [
43 refund:[ 55 {
44 { 56 key: 0,
45 key:0, 57 img: "/static/img/detail/d1.png",
46 img:'/static/img/detail/d1.png', 58 name: "商品名称",
47 name:'商品名称', 59 standard: "玫瑰金/钛合金/防日光防紫外线/超薄超轻",
48 standard:'玫瑰金/钛合金/防日光防紫外线/超薄超轻', 60 price: 180,
49 price: 180, 61 number: 1,
50 number: 1, 62 refundprice: 110,
51 refundprice: 110, 63 refund_img: "/static/img/detail/refund_img.png"
52 refund_img:'/static/img/detail/refund_img.png', 64 }
53 } 65 ]
54 ], 66 };
55 } 67 }
56 } 68 };
57 }
58 </script> 69 </script>
59 70
60 <style lang="scss"> 71 <style lang="scss">
61 72 .container {
62 .container{ 73 background: #f2f2f2;
63 background: #F2F2F2; 74 padding-top: 10px;
64 padding-top: 10px; 75 box-sizing: border-box;
65 box-sizing: border-box;
66 } 76 }
67 .refund{ 77 .refund {
68 width: 90%; 78 width: 90%;
69 height: 300px; 79 height: 300px;
70 margin: 0 auto; 80 margin: 0 auto;
71 background: #FFFFFF; 81 background: #ffffff;
72 box-shadow: 0 0 10px 0 rgba(177,128,128,0.06); 82 box-shadow: 0 0 10px 0 rgba(177, 128, 128, 0.06);
73 border-radius: 8px; 83 border-radius: 8px;
74 padding: 14px; 84 padding: 14px;
75 box-sizing: border-box; 85 box-sizing: border-box;
76 } 86 }
77 .detail{ 87 .detail {
78 display: flex; 88 display: flex;
79 justify-content: space-between; 89 justify-content: space-between;
80 font-family: PingFangSC-Regular; 90 font-family: PingFangSC-Regular;
81 margin-bottom: 20px; 91 margin-bottom: 20px;
82 .detail2{ 92 .detail2 {
83 width: 64%; 93 width: 64%;
84 view{ 94 view {
85 margin-bottom: 8px; 95 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 } 96 }
102 .detail_img{ 97 .detail_name {
103 width: 188rpx; 98 font-size: 14px;
104 height: 188rpx; 99 color: #333333;
105 border-radius: 40px;
106 image{
107 width: 100%;
108 height: 100%;
109 }
110 } 100 }
111 } 101 .detail_standard {
112 102 font-size: 12px;
113 .refund_price{ 103 color: #999999;
114 font-family: PingFangSC-Semibold; 104 }
115 font-size: 14px; 105 .detail_price {
116 color: #333333; 106 font-size: 14px;
117 letter-spacing: -0.26px; 107 color: #999999;
118 line-height: 18px; 108 display: flex;
119 margin-bottom: 26px; 109 justify-content: space-between;
120 .refund_price1{
121 font-weight: bold;
122 margin-right: 16px;
123 } 110 }
124 .refund_price2{ 111 }
125 color: #FF6B4A; 112 .detail_img {
113 width: 188rpx;
114 height: 188rpx;
115 border-radius: 40px;
116 image {
117 width: 100%;
118 height: 100%;
126 } 119 }
120 }
127 } 121 }
src/pages/refundment/refundment.vue
1 <template> 1 <template>
2 <view class="container" v-bind:style="{height: curheight+'px'}"> 2 <view
3 <view class="refund" v-for="(items) in refund" :key="items.key"> 3 class="container"
4 <view class="detail"> 4 v-bind:style="{height: curheight+'px'}"
5 <view class="detail_img"><image v-bind:src="items.img"></image></view> 5 >
6 <view class="detail2"> 6 <view
7 <view class="detail_name">{{items.name}}</view> 7 class="refund"
8 <view class="detail_standard">规格:{{items.standard}}</view> 8 v-for="(items) in refund"
9 <view class="detail_price"> 9 :key="items.key"
10 <span>¥{{items.price}}</span> 10 >
11 <span>X{{items.number}}</span> 11 <view class="detail">
12 </view> 12 <view class="detail_img">
13 </view> 13 <image v-bind:src="items.img"></image>
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 <span >退款原因</span>
21 <!-- 跳转退款原因详细页 -->
22 <view @click="Jump()">请选择<image src="/static/img/detail/xiala.png"></image></view>
23 </view>
24 <view class="refund_explain">
25 <span>退款说明</span>
26 <input placeholder="选填" value="">
27 </view>
28 <view class="refund_img">
29 <span class="refund_img1">上传图片</span>
30 <span class="refund_img2">(最多3张)</span>
31 <view><image v-bind:src="items.refund_img"></image></view>
32 </view>
33 </view> 14 </view>
34 <view class="button"> 15 <view class="detail2">
35 <span>提交</span> 16 <view class="detail_name">{{items.name}}</view>
17 <view class="detail_standard">规格:{{items.standard}}</view>
18 <view class="detail_price">
19 <span>¥{{items.price}}</span>
20 <span>X{{items.number}}</span>
21 </view>
36 </view> 22 </view>
23 </view>
24 <view class="refund_price">
25 <span class="refund_price1">退款金额</span>
26 <span class="refund_price2">¥{{items.refundprice}}</span>
27 </view>
28 <view class="refund_reason">
29 <span>退款原因</span>
30 <!-- 跳转退款原因详细页 -->
31 <view @click="Jump()">请选择<image src="/static/img/detail/xiala.png"></image>
32 </view>
33 </view>
34 <view class="refund_explain">
35 <span>退款说明</span>
36 <input
37 placeholder="选填"
38 value=""
39 >
40 </view>
41 <view class="refund_img">
42 <span class="refund_img1">上传图片</span>
43 <span class="refund_img2">(最多3张)</span>
44 <view>
45 <image v-bind:src="items.refund_img"></image>
46 </view>
47 </view>
48 </view>
49 <view class="button">
50 <span>提交</span>
37 </view> 51 </view>
52 </view>
38 </template> 53 </template>
39 54
40 <script> 55 <script>
41
42 export default { 56 export default {
43 //获取浏览器高度 57 //获取浏览器高度
44 beforeMount(height){ 58 beforeMount(height) {
45 var h = document.documentElement.clientHeight || document.body.clientHeight; 59 var h = document.documentElement.clientHeight || document.body.clientHeight;
46 this.curheight = h-44; 60 this.curheight = h - 44;
47 61 },
48 }, 62 methods: {
49 methods:{ 63 Jump() {
50 Jump(){ 64 this.$router.push({ path: "refundWays" });
51 this.$router.push({path: "Refundways"})
52 },
53 },
54 data(){
55 return{
56 curheight:0, //浏览器高度
57 refund:[
58 {
59 key:0,
60 img:'/static/img/detail/d1.png',
61 name:'商品名称',
62 standard:'玫瑰金/钛合金/防日光防紫外线/超薄超轻',
63 price: 180,
64 number: 1,
65 refundprice: 110,
66 refund_img:'/static/img/detail/refund_img.png',
67 }
68 ],
69 }
70 } 65 }
71 } 66 },
67 data() {
68 return {
69 curheight: 0, //浏览器高度
70 refund: [
71 {
72 key: 0,
73 img: "/static/img/detail/d1.png",
74 name: "商品名称",
75 standard: "玫瑰金/钛合金/防日光防紫外线/超薄超轻",
76 price: 180,
77 number: 1,
78 refundprice: 110,
79 refund_img: "/static/img/detail/refund_img.png"
80 }
81 ]
82 };
83 }
84 };
72 </script> 85 </script>
73 86
74 <style lang="scss"> 87 <style lang="scss">
75 88 .container {
76 .container{ 89 background: #f2f2f2;
77 background: #F2F2F2; 90 padding-top: 10px;
78 padding-top: 10px; 91 box-sizing: border-box;
79 box-sizing: border-box;
80 } 92 }
81 .refund{ 93 .refund {
82 width: 90%; 94 width: 90%;
83 height: 353px; 95 height: 353px;
84 margin: 0 auto; 96 margin: 0 auto;
85 background: #FFFFFF; 97 background: #ffffff;
86 box-shadow: 0 0 10px 0 rgba(177,128,128,0.06); 98 box-shadow: 0 0 10px 0 rgba(177, 128, 128, 0.06);
87 border-radius: 8px; 99 border-radius: 8px;
88 padding: 14px; 100 padding: 14px;
89 box-sizing: border-box; 101 box-sizing: border-box;
90 } 102 }
91 .detail{ 103 .detail {
92 display: flex; 104 display: flex;
93 justify-content: space-between; 105 justify-content: space-between;
94 font-family: PingFangSC-Regular; 106 font-family: PingFangSC-Regular;
95 margin-bottom: 20px; 107 margin-bottom: 20px;
96 .detail2{ 108 .detail2 {
97 width: 64%; 109 width: 64%;
98 view{ 110 view {
99 margin-bottom: 8px; 111 margin-bottom: 8px;
100 }
101 .detail_name{
102 font-size: 14px;
103 color:#333333;
104 }
105 .detail_standard{
106 font-size: 12px;
107 color: #999999;
108 }
109 .detail_price{
110 font-size: 14px;
111 color: #999999;
112 display: flex;
113 justify-content: space-between;
114 }
115 } 112 }
116 .detail_img{ 113 .detail_name {
117 width: 188rpx; 114 font-size: 14px;
118 height: 188rpx; 115 color: #333333;
119 border-radius: 40px;
120 image{
121 width: 100%;
122 height: 100%;
123 }
124 } 116 }
125 } 117 .detail_standard {
126 .refund_explain,.refund_img,.refund_price,.refund_reason{ 118 font-size: 12px;
127 margin-top: 16px; 119 color: #999999;
128 margin-bottom: 16px; 120 }
129 } 121 .detail_price {
130 .refund_price{ 122 font-size: 14px;
131 font-family: PingFangSC-Semibold; 123 color: #999999;
132 font-size: 14px; 124 display: flex;
133 color: #333333; 125 justify-content: space-between;
134 letter-spacing: -0.26px;
135 line-height: 18px;
136 .refund_price1{
137 font-weight: bold;
138 margin-right: 16px;
139 } 126 }
140 .refund_price2{ 127 }
141 color: #FF6B4A; 128 .detail_img {
129 width: 188rpx;
130 height: 188rpx;
131 border-radius: 40px;
132 image {
133 width: 100%;
134 height: 100%;
142 } 135 }
136 }
143 } 137 }
144 .refund_reason,.refund_explain span,.refund_img1{ 138 .refund_explain,
145 font-family: PingFangSC-Regular; 139 .refund_img,
146 font-size: 12px; 140 .refund_price,
147 color: #333333; 141 .refund_reason {
148 letter-spacing: -0.23px; 142 margin-top: 16px;
149 line-height: 18px; 143 margin-bottom: 16px;
150 } 144 }
151 .refund_explain{ 145 .refund_price {
152 display: flex; 146 font-family: PingFangSC-Semibold;
153 justify-content: space-between; 147 font-size: 14px;
154 align-items: center; 148 color: #333333;
149 letter-spacing: -0.26px;
150 line-height: 18px;
151 .refund_price1 {
152 font-weight: bold;
153 margin-right: 16px;
154 }
155 .refund_price2 {
156 color: #ff6b4a;
157 }
155 } 158 }
156 .refund_explain input,.refund_img2{ 159 .refund_reason,
157 width: 78%; 160 .refund_explain span,
158 font-family: PingFangSC-Regular; 161 .refund_img1 {
159 font-size: 12px; 162 font-family: PingFangSC-Regular;
160 color: #B8B8B8; 163 font-size: 12px;
161 letter-spacing: -0.23px; 164 color: #333333;
165 letter-spacing: -0.23px;
166 line-height: 18px;
162 } 167 }
163 .refund_reason{ 168 .refund_explain {
164 span{ 169 display: flex;
165 margin-right: 20px; 170 justify-content: space-between;
166 } 171 align-items: center;