刘文博 / gulu-vue

Download as
Browse Code »

Commit 72d769fb774836b40ff5c311f4223ce02c106c7b

Authored by mullins
1 parent e2eaa8a22b
Exists in master

myOrder

Showing 7 changed files with 179 additions and 78 deletions   Show diff stats
1 { 1 {
2 "pages": [ 2 "pages": [
3 {
4 "path" : "pages/myOrder/myOrder",
5 "style" : {
6 "navigationBarTitleText": "我的订单"}
7 },
3 { 8 {
4 "path": "pages/cart/cart", 9 "path": "pages/cart/cart",
5 "style": { 10 "style": {
6 "navigationBarTitleText": "购物车" 11 "navigationBarTitleText": "购物车"
7 } 12 }
8 }, 13 },
9 { 14 {
10 "path": "pages/index/index", 15 "path": "pages/index/index",
11 "style": { 16 "style": {
12 "navigationBarTitleText": "商城一览" 17 "navigationBarTitleText": "商城一览"
13 } 18 }
14 }, 19 },
15 { 20 {
16 "path": "pages/frameDetail/frameDetail", 21 "path": "pages/frameDetail/frameDetail",
17 "style": { 22 "style": {
18 "navigationBarTitleText": "产品详情" 23 "navigationBarTitleText": "产品详情"
19 } 24 }
20 }, 25 },
21 { 26 {
22 "path": "pages/lensDetails/lensDetails", 27 "path": "pages/lensDetails/lensDetails",
23 "style": { 28 "style": {
24 "navigationBarTitleText": "产品详情" 29 "navigationBarTitleText": "产品详情"
25 } 30 }
26 }, 31 },
27 { 32 {
28 "path" : "pages/purchaseLenses/purchaseLenses", 33 "path" : "pages/purchaseLenses/purchaseLenses",
29 "style" : { 34 "style" : {
30 "navigationBarTitleText": "产品选购" 35 "navigationBarTitleText": "产品选购"
31 } 36 }
32 }, 37 },
33 { 38 {
34 "path" : "pages/refundProgress/refundProgress", 39 "path" : "pages/refundProgress/refundProgress",
35 "style": { 40 "style": {
36 "navigationBarTitleText": "申请退款" 41 "navigationBarTitleText": "申请退款"
37 } 42 }
38 }, 43 },
39 {
40 "path" : "pages/myOrder/myOrder",
41 "style" : {
42 "navigationBarTitleText": "我的订单"}
43 },
44 { 44 {
45 "path": "pages/addAddress/addAddress", 45 "path": "pages/addAddress/addAddress",
46 "style": { 46 "style": {
47 "navigationBarTitleText": "新增地址" 47 "navigationBarTitleText": "新增地址"
48 } 48 }
49 }, 49 },
50 { 50 {
51 "path" : "pages/confirmOrder/confirmOrder", 51 "path" : "pages/confirmOrder/confirmOrder",
52 "style" : { 52 "style" : {
53 "navigationBarTitleText": "确认订单"} 53 "navigationBarTitleText": "确认订单"}
54 }, 54 },
55 { 55 {
56 "path": "pages/user/user", 56 "path": "pages/user/user",
57 "style": { 57 "style": {
58 "navigationBarTitleText": "我的" 58 "navigationBarTitleText": "我的"
59 } 59 }
60 }, 60 },
61 { 61 {
62 "path": "pages/refundment/refundWays" 62 "path": "pages/refundment/refundWays"
63 }, 63 },
64 { 64 {
65 "path": "pages/refundment/refundment" 65 "path": "pages/refundment/refundment"
66 }, 66 },
67 { 67 {
68 "path": "pages/predelivery/predelivery" 68 "path": "pages/predelivery/predelivery"
69 }, 69 },
70 { 70 {
71 "path": "pages/customerService/customerService" 71 "path": "pages/customerService/customerService"
72 }, 72 },
73 { 73 {
74 "path": "pages/myOrderPaying/myOrderPaying" 74 "path": "pages/myOrderPaying/myOrderPaying"
75 } 75 }
76 76
77 ], 77 ],
78 "globalStyle": { 78 "globalStyle": {
79 "navigationBarTextStyle": "black", 79 "navigationBarTextStyle": "black",
80 "navigationBarTitleText": "uni-app", 80 "navigationBarTitleText": "uni-app",
81 "navigationBarBackgroundColor": "#F8F8F8", 81 "navigationBarBackgroundColor": "#F8F8F8",
82 "backgroundColor": "#F8F8F8" 82 "backgroundColor": "#F8F8F8"
83 }, 83 },
84 "tabBar": { 84 "tabBar": {
85 "color": "#C0C4CC", 85 "color": "#C0C4CC",
86 "selectedColor": "#fa436a", 86 "selectedColor": "#fa436a",
87 "borderStyle": "black", 87 "borderStyle": "black",
88 "backgroundColor": "#ffffff", 88 "backgroundColor": "#ffffff",
89 "list": [{ 89 "list": [{
90 "pagePath": "pages/index/index", 90 "pagePath": "pages/index/index",
91 "iconPath": "static/tab-home.png", 91 "iconPath": "static/tab-home.png",
92 "selectedIconPath": "static/tab-home-current.png", 92 "selectedIconPath": "static/tab-home-current.png",
93 "text": "首页" 93 "text": "首页"
94 }, 94 },
95 { 95 {
96 "pagePath": "pages/cart/cart", 96 "pagePath": "pages/cart/cart",
97 "iconPath": "static/tab-cart.png", 97 "iconPath": "static/tab-cart.png",
98 "selectedIconPath": "static/tab-cart-current.png", 98 "selectedIconPath": "static/tab-cart-current.png",
99 "text": "购物车" 99 "text": "购物车"
100 }, 100 },
101 { 101 {
102 "pagePath": "pages/user/user", 102 "pagePath": "pages/user/user",
103 "iconPath": "static/tab-my.png", 103 "iconPath": "static/tab-my.png",
104 "selectedIconPath": "static/tab-my-current.png", 104 "selectedIconPath": "static/tab-my-current.png",
105 "text": "我的" 105 "text": "我的"
src/pages/index/index.vue
Diff comments   View file @72d769f
1 <template> 1 <template>
2 <view class="content"> 2 <view class="content">
3 <view class="header"> 3 <view class="header">
4 <!-- 搜索--> 4 <!-- 搜索-->
5 <view class="searchBar"> 5 <view class="searchBar">
6 <icon class="searchIcon" type="search" size="14"></icon> 6 <icon class="searchIcon" type="search" size="14"></icon>
7 <input class="searchIpt" placeholder="老花镜" confirm-type="search" /> 7 <input class="searchIpt" placeholder="老花镜" confirm-type="search" />
8 </view> 8 </view>
9 9
10 <!-- 筛选栏--> 10 <!-- 筛选栏-->
11 <view class="screenBar"> 11 <view class="screenBar">
12 <view v-for="item in screenItems" :key="item.current" @click="onClickItem(item.current)"> 12 <view v-for="item in screenItems" :key="item.current" @click="onClickItem(item.current)">
13 <view 13 <view
14 class="screenItem" 14 class="screenItem"
15 v-bind:class="{ active: current === item.current }" 15 v-bind:class="{ active: current === item.current }"
16 v-if="item.current === 2" 16 v-if="item.current === 2"
17 @click="dropDown" 17 @click="dropDown"
18 > 18 >
19 {{ item.text }} 19 {{ item.text }}
20 <icon type="info" size="14"></icon> 20 <icon type="info" size="14"></icon>
21 </view> 21 </view>
22 <view 22 <view
23 class="screenItem" 23 class="screenItem"
24 v-bind:class="{ active: current === item.current }" 24 v-bind:class="{ active: current === item.current }"
25 v-if="item.current === 4" 25 v-if="item.current === 4"
26 @click="showDrawer('showRight')" 26 @click="showDrawer('showRight')"
27 > 27 >
28 {{ item.text }} 28 {{ item.text }}
29 <icon type="info" size="14"></icon> 29 <icon type="info" size="14"></icon>
30 </view> 30 </view>
31 <view v-if="item.current !== 2&&item.current!==4"> 31 <view v-if="item.current !== 2&&item.current!==4">
32 <view 32 <view
33 class="screenItem" 33 class="screenItem"
34 v-bind:class="{ active: current === item.current }" 34 v-bind:class="{ active: current === item.current }"
35 >{{ item.text }}</view> 35 >{{ item.text }}</view>
36 </view> 36 </view>
37 </view> 37 </view>
38 </view> 38 </view>
39 </view> 39 </view>
40 <Uni-drawer 40 <Uni-drawer
41 ref="showRight" 41 ref="showRight"
42 mask="true" 42 mask="true"
43 maskClick="true" 43 maskClick="true"
44 mode="right" 44 mode="right"
45 :width="320" 45 :width="320"
46 @change="change($event,'showRight')" 46 @change="change($event,'showRight')"
47 > 47 >
48 <view class="close"> 48 <view class="close">
49 <view @click="closeDrawer('showRight')"> 49 <view @click="closeDrawer('showRight')">
50 <text class="word-btn-white">关闭</text> 50 <text class="word-btn-white">关闭</text>
51 </view> 51 </view>
52 </view> 52 </view>
53 </Uni-drawer> 53 </Uni-drawer>
54 54
55 <!-- 筛选菜单--> 55 <!-- 筛选菜单-->
56 <view class="content-wrap"> 56 <view class="content-wrap">
57 <view> 57 <view>
58 <HMfilterDropdown 58 <HMfilterDropdown
59 :filterData="filterData" 59 :filterData="filterData"
60 :defaultSelected="filterDropdownValue" 60 :defaultSelected="filterDropdownValue"
61 :updateMenuName="true" 61 :updateMenuName="true"
62 @confirm="confirm" 62 @confirm="confirm"
63 data-format="Object" 63 data-format="Object"
64 ></HMfilterDropdown> 64 ></HMfilterDropdown>
65 <!-- 商品列表 --> 65 <!-- 商品列表 -->
66 <view class="goods-list"> 66 <view class="goods-list">
67 <view class="product-list"> 67 <view class="product-list">
68 <view class="product" v-for="(goods) in goodsList" :key="goods.id"> 68 <view class="product" v-for="(goods) in goodsList" :key="goods.id">
69 <Card :goods="goods"></Card> 69 <Card :goods="goods"></Card>
70 </view> 70 </view>
71 </view> 71 </view>
72 <view class="loading-text">{{loadingText}}</view> 72 <view class="loading-text">{{loadingText}}</view>
73 </view> 73 </view>
74 </view> 74 </view>
75 </view> 75 </view>
76 </view> 76 </view>
77 </template> 77 </template>
78 78
79 <script> 79 <script>
80 import UniDrawer from "@/components/UniDrawer/UniDrawer.vue"; 80 import UniDrawer from "@/components/UniDrawer/UniDrawer.vue";
81 import Card from "@/components/CommodityCard/CommodityCard.vue"; 81 import Card from "@/components/CommodityCard/CommodityCard.vue";
82 import HMfilterDropdown from "@/components/HMFilterDropdown/HMFilterDropdown.vue"; 82 import HMfilterDropdown from "@/components/HMFilterDropdown/HMFilterDropdown.vue";
83 import data from "@/common/data.js"; //筛选菜单数据 83 import data from "@/common/data.js"; //筛选菜单数据
84 import store from '@/store'; 84 import store from '@/store';
85 85
86 export default { 86 export default {
87 components: { 87 components: {
88 UniDrawer: UniDrawer, 88 UniDrawer: UniDrawer,
89 HMfilterDropdown: HMfilterDropdown, 89 HMfilterDropdown: HMfilterDropdown,
90 Card: Card 90 Card: Card
91 }, 91 },
92 data() { 92 data() {
93 return { 93 return {
94 screenItems: [ 94 screenItems: [
95 { current: 0, text: "全部", hasIcon: false }, 95 { current: 0, text: "全部", hasIcon: false },
96 { current: 1, text: "销量", hasIcon: false }, 96 { current: 1, text: "销量", hasIcon: false },
97 { current: 2, text: "价格", hasIcon: true }, 97 { current: 2, text: "价格", hasIcon: true },
98 { current: 3, text: "折扣", hasIcon: false }, 98 { current: 3, text: "折扣", hasIcon: false },
99 { current: 4, text: "筛选", hasIcon: true } 99 { current: 4, text: "筛选", hasIcon: true }
100 ], 100 ],
101 current: 0, 101 current: 0,
102 showRight: false, 102 showRight: false,
103 indexArr: "", 103 indexArr: "",
104 valueArr: "", 104 valueArr: "",
105 // //商品数据 105 // //商品数据
106 // goodsList: [ 106 // goodsList: [
107 // { 107 // {
108 // // goods_id: 0, 108 // // goods_id: 0,
109 // // img: "/static/img/goods/p1.jpg", 109 // // img: "/static/img/goods/p1.jpg",
110 // // name: "商品名称", 110 // // name: "商品名称",
111 // // originCost: "￥198", 111 // // originCost: "￥198",
112 // // price: "￥168", 112 // // price: "￥168",
113 // // slogan: "1235人浏览" 113 // // slogan: "1235人浏览"
114 // } 114 // }
115 // ], 115 // ],
116 loadingText: "正在加载...", 116 loadingText: "正在加载...",
117 filterDropdownValue: [], 117 filterDropdownValue: [],
118 filterData: [] 118 filterData: []
119 }; 119 };
120 }, 120 },
121 computed: { 121 computed: {
122 goodsList() { 122 goodsList() {
123 // 也可以从 getters 获取 123 // 也可以从 getters 获取
124 console.log(this.$store.getters.list); 124 console.log('list', this.$store.state.test.list);
125 return this.$store.state.test.list; 125 return this.$store.state.test.list;
126 } 126 }
127 }, 127 },
128 filters: { 128 filters: {
129 outData(value) { 129 outData(value) {
130 return JSON.stringify(value); 130 return JSON.stringify(value);
131 } 131 }
132 }, 132 },
133 onLoad: function() { 133 onLoad: function() {
134 store.dispatch('test/fetch'); 134 store.dispatch('test/fetch');
135 // uni.request({ 135 // uni.request({
136 // url: "https://api.glass.xiuyetang.com/app/prod/list", 136 // url: "https://api.glass.xiuyetang.com/app/prod/list",
137 // method: "post", 137 // method: "post",
138 // data: { 138 // data: {
139 // // text: 'uni.request' 139 // // text: 'uni.request'
140 // }, 140 // },
141 // header: { 141 // header: {
142 // // 'custom-header': 'hello', //自定义请求头信息 142 // // 'custom-header': 'hello', //自定义请求头信息
143 // "Content-Type": "application/x-www-form-urlencoded" 143 // "Content-Type": "application/x-www-form-urlencoded"
144 // // 'Content-Type':'multipart/form-data' 144 // // 'Content-Type':'multipart/form-data'
145 // // 'Content-Type':'ext/plain' 145 // // 'Content-Type':'ext/plain'
146 // }, 146 // },
147 // timeout: 3000, 147 // timeout: 3000,
148 // // dataType:'json' 148 // // dataType:'json'
149 // // responseType:'text', 149 // // responseType:'text',
150 // // sslVerify: true, //验证 ssl 证书 150 // // sslVerify: true, //验证 ssl 证书
151 // withCredentials: false, //跨域请求时是否携带凭证（cookies） 151 // withCredentials: false, //跨域请求时是否携带凭证（cookies）
152 // success: res => { 152 // success: res => {
153 // console.error("success status === > ", res); 153 // console.error("success status === > ", res);
154 // this.goodsList = res.data.data; 154 // this.goodsList = res.data.data;
155 // // console.log('res.data', res.data); 155 // // console.log('res.data', res.data);
156 // // this.text = 'request success'; 156 // // this.text = 'request success';
157 // }, 157 // },
158 // fail: res => { 158 // fail: res => {
159 // console.log("fail status === > ", res); 159 // console.log("fail status === > ", res);
160 // }, 160 // },
161 // complete: res => { 161 // complete: res => {
162 // console.log("complete status === > ", res); 162 // console.log("complete status === > ", res);
163 // } 163 // }
164 // }); 164 // });
165 //定时器模拟ajax异步请求数据 165 //定时器模拟ajax异步请求数据
166 // setTimeout(()=>{ 166 // setTimeout(()=>{
167 // //传入defaultSelected的结构不能错，错了就报错运行异常。 不选中的项目传入null 167 // //传入defaultSelected的结构不能错，错了就报错运行异常。 不选中的项目传入null
168 // this.filterDropdownValue = [ 168 // this.filterDropdownValue = [
169 // [1,1,0], //第0个菜单选中 一级菜单的第1项，二级菜单的第1项，三级菜单的第3项 169 // [1,1,0], //第0个菜单选中 一级菜单的第1项，二级菜单的第1项，三级菜单的第3项
170 // [null,null], //第1个菜单选中 都不选中 170 // [null,null], //第1个菜单选中 都不选中
171 // [1], //第2个菜单选中 一级菜单的第1项 171 // [1], //第2个菜单选中 一级菜单的第1项
172 // [[0],[1,2,7],[1,0]], //筛选菜单选中 第一个筛选的第0项，第二个筛选的第1,2,7项，第三个筛选的第1,0项 172 // [[0],[1,2,7],[1,0]], //筛选菜单选中 第一个筛选的第0项，第二个筛选的第1,2,7项，第三个筛选的第1,0项
173 // [[0],[1],[1]], //单选菜单选中 第一个筛选的第0项，第二个筛选的第1项，第三个筛选的第1项 173 // [[0],[1],[1]], //单选菜单选中 第一个筛选的第0项，第二个筛选的第1项，第三个筛选的第1项
174 // ]; 174 // ];
175 // this.filterData = data; 175 // this.filterData = data;
176 // },100); 176 // },100);
177 // 模拟ajax请求子菜单数据。 177 // 模拟ajax请求子菜单数据。
178 // setTimeout(()=>{ 178 // setTimeout(()=>{
179 // console.log('发起请求','ddddddd'); 179 // console.log('发起请求','ddddddd');
180 // // this.filterData[1].submenu[0].submenu = [{"name": "附近","value": "附近"},{"name": "1km","value": "1km"},{"name": "2km","value": "2km"},{"name": "3km","value": "3km"},{"name": "4km","value": "4km"},{"name": "5km","value": "5km"}]; 180 // // this.filterData[1].submenu[0].submenu = [{"name": "附近","value": "附近"},{"name": "1km","value": "1km"},{"name": "2km","value": "2km"},{"name": "3km","value": "3km"},{"name": "4km","value": "4km"},{"name": "5km","value": "5km"}];
181 // },3000); 181 // },3000);
182 }, 182 },
183 methods: { 183 methods: {
184 showDrawer(e) { 184 showDrawer(e) {
185 this.$refs[e].open(); 185 this.$refs[e].open();
186 }, 186 },
187 closeDrawer(e) { 187 closeDrawer(e) {
188 this.$refs[e].close(); 188 this.$refs[e].close();
189 }, 189 },
190 change(e, type) { 190 change(e, type) {
191 this[type] = e; 191 this[type] = e;
192 }, 192 },
193 onClickItem(e) { 193 onClickItem(e) {
194 if (this.current !== e) { 194 if (this.current !== e) {
195 this.current = e; 195 this.current = e;
196 } 196 }
197 }, 197 },
198 dropDown() { 198 dropDown() {
199 console.log("下拉"); 199 console.log("下拉");
200 }, 200 },
201 //接收菜单结果 201 //接收菜单结果
202 confirm(e) { 202 confirm(e) {
203 this.indexArr = e.index; 203 this.indexArr = e.index;
204 this.valueArr = e.value; 204 this.valueArr = e.value;
205 return; 205 return;
206 console.log("修改菜单"); 206 console.log("修改菜单");
207 this.filterData[4].submenu[1] = { 207 this.filterData[4].submenu[1] = {
208 name: "项目2", 208 name: "项目2",
209 submenu: [] 209 submenu: []
210 }; 210 };
211 } 211 }
212 }, 212 },
213 onNavigationBarButtonTap(e) { 213 onNavigationBarButtonTap(e) {
214 this.showRight = !this.showRight; 214 this.showRight = !this.showRight;
215 }, 215 },
216 //上拉加载， 216 //上拉加载，
217 onReachBottom() { 217 onReachBottom() {
218 console.log("到底加载"); 218 console.log("到底加载");
219 let len = this.goodsList.length; 219 let len = this.goodsList.length;
220 if (len >= 30) { 220 if (len >= 30) {
221 this.loadingText = "~~到底了~~"; 221 this.loadingText = "~~到底了~~";
222 return false; 222 return false;
223 } else { 223 } else {
224 this.loadingText = "正在加载..."; 224 this.loadingText = "正在加载...";
225 } 225 }
226 let end_goods_id = this.goodsList[len - 1].goods_id; 226 let end_goods_id = this.goodsList[len - 1].goods_id;
227 for (let i = 1; i <= 10; i++) { 227 for (let i = 1; i <= 10; i++) {
228 let goods_id = end_goods_id + i; 228 let goods_id = end_goods_id + i;
229 let p = { 229 let p = {
230 goods_id: goods_id, 230 goods_id: goods_id,
231 img: 231 img:
232 "/static/img/goods/p" + 232 "/static/img/goods/p" +
233 (goods_id % 10 == 0 ? 10 : goods_id % 10) + 233 (goods_id % 10 == 0 ? 10 : goods_id % 10) +
234 ".jpg", 234 ".jpg",
235 name: "商品名称", 235 name: "商品名称",
236 originCost: "￥198", 236 originCost: "￥198",
237 price: "￥168", 237 price: "￥168",
238 slogan: "1235人付款" 238 slogan: "1235人付款"
239 }; 239 };
240 this.goodsList.push(p); 240 this.goodsList.push(p);
241 } 241 }
242 } 242 }
243 }; 243 };
244 </script> 244 </script>
245 245
246 <style lang="scss"> 246 <style lang="scss">
247 .content { 247 .content {
248 display: flex; 248 display: flex;
249 flex-direction: column; 249 flex-direction: column;
250 align-items: center; 250 align-items: center;
251 justify-content: center; 251 justify-content: center;
252 background-color: #f7f6f6; 252 background-color: #f7f6f6;
253 } 253 }
254 .header { 254 .header {
255 display: flex; 255 display: flex;
256 flex-direction: column; 256 flex-direction: column;
257 align-items: center; 257 align-items: center;
258 justify-content: center; 258 justify-content: center;
259 background-color: #f7f6f6; 259 background-color: #f7f6f6;
260 height: 178rpx; 260 height: 178rpx;
261 width: 100%; 261 width: 100%;
262 z-index: 999; 262 z-index: 999;
263 position: fixed; 263 position: fixed;
264 top: 0; 264 top: 0;
265 left: 0; 265 left: 0;
266 } 266 }
267 .searchBar { 267 .searchBar {
268 width: 670rpx; 268 width: 670rpx;
269 display: flex; 269 display: flex;
270 justify-content: center; 270 justify-content: center;
271 align-items: center; 271 align-items: center;
272 box-sizing: border-box; 272 box-sizing: border-box;
273 padding: 0rpx 16rpx; 273 padding: 0rpx 16rpx;
274 border: 1px solid #ff6b4a; 274 border: 1px solid #ff6b4a;
275 border-radius: 8rpx; 275 border-radius: 8rpx;
276 background-color: #ffffff; 276 background-color: #ffffff;
277 } 277 }
278 278
279 .searchIpt { 279 .searchIpt {
280 height: 68rpx; 280 height: 68rpx;
281 width: 670rpx; 281 width: 670rpx;
282 padding: 16rpx; 282 padding: 16rpx;
283 font-size: 28rpx; 283 font-size: 28rpx;
284 box-sizing: border-box; 284 box-sizing: border-box;
285 } 285 }
286 .screenBar { 286 .screenBar {
287 width: 670rpx; 287 width: 670rpx;
288 height: 110rpx; 288 height: 110rpx;
289 display: flex; 289 display: flex;
290 flex-direction: row; 290 flex-direction: row;
291 justify-content: space-between; 291 justify-content: space-between;
292 align-items: center; 292 align-items: center;
293 color: #333333; 293 color: #333333;
294 font-size: 32rpx; 294 font-size: 32rpx;
295 } 295 }
296 .active { 296 .active {
297 color: #ff6b4a; 297 color: #ff6b4a;
298 } 298 }
299 .screenItem { 299 .screenItem {
300 display: flex; 300 display: flex;
301 justify-content: center; 301 justify-content: center;
302 align-items: center; 302 align-items: center;
303 } 303 }
304 .content-wrap { 304 .content-wrap {
305 width: 100%; 305 width: 100%;
306 background-color: #ffffff; 306 background-color: #ffffff;
307 } 307 }
308 308
309 .HMfilterDropdown { 309 .HMfilterDropdown {
310 top: 178rpx !important; 310 top: 178rpx !important;
311 } 311 }
312 312
313 .goods-list { 313 .goods-list {
314 padding-top: 286rpx; 314 padding-top: 286rpx;
315 .loading-text { 315 .loading-text {
316 width: 100%; 316 width: 100%;
317 display: flex; 317 display: flex;
318 justify-content: center; 318 justify-content: center;
319 align-items: center; 319 align-items: center;
320 height: 30px; 320 height: 30px;
321 color: #979797; 321 color: #979797;
322 font-size: 12px; 322 font-size: 12px;
323 } 323 }
324 .product-list { 324 .product-list {
325 width: 92%; 325 width: 92%;
326 padding: 0 4% 3vw 4%; 326 padding: 0 4% 3vw 4%;
327 display: flex; 327 display: flex;
328 justify-content: space-between; 328 justify-content: space-between;
329 flex-wrap: wrap; 329 flex-wrap: wrap;
330 .product { 330 .product {
331 width: 48%; 331 width: 48%;
332 margin: 0 0 20rpx 0; 332 margin: 0 0 20rpx 0;
333 background: #ffffff; 333 background: #ffffff;
334 border: 1px solid #f2f2f2; 334 border: 1px solid #f2f2f2;
335 } 335 }
336 } 336 }
337 } 337 }
338 </style> 338 </style>
339 339
src/pages/myOrder/components/OrderCard.vue
Diff comments   View file @72d769f
1 <template> 1 <template>
2 <view> 2 <view>
3 <view class="card" v-if="current === order.orderType" > 3 <view class="card" v-if="current === order.orderType" >
4 <view class="cardHeader"> 4 <view class="cardHeader">
5 <text class="orderId">订单号：{{order.orderId}}</text> 5 <text class="orderId">订单号：{{order.orderId}}</text>
6 <text class="orderType" v-if="order.orderType===1">待付款</text> 6 <text class="orderType" v-if="order.orderType===1">待付款</text>
7 <text class="orderType" v-if="order.orderType===2">待发货</text> 7 <text class="orderType" v-if="order.orderType===2">待发货</text>
8 <text class="orderType" v-if="order.orderType === 3">待收货</text> 8 <text class="orderType" v-if="order.orderType === 3">待收货</text>
9 <text class="orderType" v-if="order.orderType === 4">退款售后</text> 9 <text class="orderType" v-if="order.orderType === 4">退款售后</text>
10 <text class="orderType" v-if="order.orderType === 5">已完成</text> 10 <text class="orderType" v-if="order.orderType === 5">已完成</text>
11 </view> 11 </view>
12 <view class="orderCardInfo"> 12 <view class="orderCardInfo">
13 <image :src="order.img" mode="aspectFill"></image> 13 <image :src="order.img" mode="aspectFill"></image>
14 <view class="infoText"> 14 <view class="infoText">
15 <view class="orderName">{{order.name}}</view> 15 <view class="orderName">{{order.name}}</view>
16 <view class="orderDescrib">规格：玫瑰金 / 钛合金 / 防日光防紫外线</view> 16 <view class="orderDescrib">规格：玫瑰金 / 钛合金 / 防日光防紫外线</view>
17 <view class="infoText-bottom"> 17 <view class="infoText-bottom">
18 <view class="markPrice">{{order.price}}</view> 18 <view class="markPrice">{{order.price}}</view>
19 <view class="buy-num">X{{order.buyNum}}</view> 19 <view class="buy-num">X{{order.buyNum}}</view>
20 </view> 20 </view>
21 </view> 21 </view>
22 </view> 22 </view>
23 <view class="payPrice">实付：<text class="priceNum">{{order.price}}</text> </view> 23 <view class="payPrice">实付：<text class="priceNum">{{order.price}}</text> </view>
24 <view class="btns" v-if="order.orderType === 1"> 24 <view class="btns" v-if="order.orderType === 1">
25 <view class="btn-type1">申请退款</view> 25 <view class="btn-type1">申请退款</view>
26 <view class="btn-type2">去支付</view> 26 <view class="btn-type2">去支付</view>
27 </view> 27 </view>
28 <view class="btns" v-if="order.orderType === 0"> 28 <view class="btns" v-if="order.orderType === 0">
29 <view class="btn-type1">再次购买</view> 29 <view class="btn-type1">再次购买</view>
30 </view> 30 </view>
31 </view> 31 </view>
32 <view class="card" v-if="current === 0" > 32 <view class="card" v-if="current === 0" >
33 <view class="cardHeader"> 33 <view class="cardHeader">
34 <text class="orderId">订单号：{{order.orderId}}</text> 34 <text class="orderId">订单号：{{order.orderId}}</text>
35 <text class="orderType" v-if="order.orderType===1">待付款</text> 35 <text class="orderType" v-if="order.orderType===1">待付款</text>
36 <text class="orderType" v-if="order.orderType===2">待发货</text> 36 <text class="orderType" v-if="order.orderType===2">待发货</text>
37 <text class="orderType" v-if="order.orderType === 3">待收货</text> 37 <text class="orderType" v-if="order.orderType === 3">待收货</text>
38 <text class="orderType" v-if="order.orderType === 4">退款售后</text> 38 <text class="orderType" v-if="order.orderType === 4">退款售后</text>
39 </view> 39 </view>
40 <view class="orderCardInfo"> 40 <view class="orderCardInfo">
41 <image :src="order.img" mode="aspectFill"></image> 41 <image :src="order.img" mode="aspectFill"></image>
42 <view class="infoText"> 42 <view class="infoText">
43 <view class="orderName">{{order.name}}</view> 43 <view class="orderName">{{order.name}}</view>
44 <view class="orderDescrib">规格：玫瑰金 / 钛合金 / 防日光防紫外线</view> 44 <view class="orderDescrib">规格：玫瑰金 / 钛合金 / 防日光防紫外线</view>
45 <view class="infoText-bottom"> 45 <view class="infoText-bottom">
46 <view class="markPrice">{{order.price}}</view> 46 <view class="markPrice">{{order.price}}</view>
47 <view class="buy-num">X{{order.buyNum}}</view> 47 <view class="buy-num">X{{order.buyNum}}</view>
48 </view> 48 </view>
49 </view> 49 </view>
50 </view> 50 </view>
51 <view class="payPrice">实付：<text class="priceNum">{{order.price}}</text> </view> 51 <view class="payPrice">实付：<text class="priceNum">{{order.price}}</text> </view>
52 <view class="btns" v-if="order.orderType === 1"> 52 <view class="btns" v-if="order.orderType === 1">
53 <view class="btn-type1" @click="toRefundment">申请退款</view> 53 <view class="btn-type1" @click="toRefundment">申请退款</view>
54 <view class="btn-type2">去支付</view> 54 <view class="btn-type2">去支付</view>
55 </view> 55 </view>
56 <view class="btns" v-if="order.orderType === 0"> 56 <view class="btns" v-if="order.orderType === 0">
57 <view class="btn-type1">再次购买</view> 57 <view class="btn-type1">再次购买</view>
58 </view> 58 </view>
59 </view> 59 </view>
60 </view> 60 </view>
61 </template> 61 </template>
62 62
63 <script> 63 <script>
64 export default { 64 export default {
65 props: { 65 props: {
66 /** 66 /**
67 * 订单数据 67 * 订单数据
68 */ 68 */
69 order: { 69 order: {
70 orderId: Number, 70 orderId: Number,
71 img: String, 71 img: String,
72 name: String, 72 name: String,
73 originCost:String, 73 originCost:String,
74 price: String, 74 price: String,
75 orderType:Number, 75 orderType:Number,
76 buyNum:Number 76 buyNum:Number
77 }, 77 },
78 /** 78 /**
79 * 当前选择 79 * 当前选择
80 */ 80 */
81 current:Number 81 current:Number
82 82
83 }, 83 },
84 data() { 84 onLoad() {
85 return { 85 // console.log('dd');
86 }; 86 console.log('order', this.props.order);
87 },
88 data() {
89 return {
90 };
87 }, 91 },
88 methods:{ 92 methods:{
89 toRefundment(){ 93 toRefundment(){
90 uni.navigateTo({ 94 uni.navigateTo({
91 url: '../refundment/refundment', 95 url: '../refundment/refundment',
92 success: res => {}, 96 success: res => {},
93 fail: () => {}, 97 fail: () => {},
94 complete: () => {} 98 complete: () => {}
95 }); 99 });
96 } 100 }
97 } 101 }
98 } 102 }
99 </script> 103 </script>
100 104
101 <style lang="scss"> 105 <style lang="scss">
102 .card{ 106 .card{
103 width: 670rpx; 107 width: 670rpx;
104 height: 478rpx; 108 height: 478rpx;
105 background: #FFFFFF; 109 background: #FFFFFF;
106 box-shadow: 0 0 10px 0 rgba(177,128,128,0.06); 110 box-shadow: 0 0 10px 0 rgba(177,128,128,0.06);
107 border-radius: 8px; 111 border-radius: 8px;
108 border-radius: 8px; 112 border-radius: 8px;
109 margin-top: 20rpx; 113 margin-top: 20rpx;
110 padding: 40rpx; 114 padding: 40rpx;
111 box-sizing: border-box; 115 box-sizing: border-box;
112 .cardHeader{ 116 .cardHeader{
113 width: 100%; 117 width: 100%;
114 height: 40rpx; 118 height: 40rpx;
115 display: flex; 119 display: flex;
116 justify-content: space-between; 120 justify-content: space-between;
117 align-items: center; 121 align-items: center;
118 .orderId{ 122 .orderId{
119 font-size: 12px; 123 font-size: 12px;
120 color: #999999; 124 color: #999999;
121 } 125 }
122 .orderType{ 126 .orderType{
123 font-size: 14px; 127 font-size: 14px;
124 color: #FF6B4A; 128 color: #FF6B4A;
125 } 129 }
126 } 130 }
127 .orderCardInfo{ 131 .orderCardInfo{
128 width: 100%; 132 width: 100%;
129 height: 188rpx; 133 height: 188rpx;
130 display: flex; 134 display: flex;
131 flex-direction: row; 135 flex-direction: row;
132 justify-content: space-between; 136 justify-content: space-between;
133 align-items: center; 137 align-items: center;
134 margin-top: 40rpx; 138 margin-top: 40rpx;
135 image{ 139 image{
136 height: 188rpx; 140 height: 188rpx;
137 width: 188rpx; 141 width: 188rpx;
138 margin-right: 24rpx; 142 margin-right: 24rpx;
139 } 143 }
140 .infoText{ 144 .infoText{
141 display: flex; 145 display: flex;
142 flex-direction: column; 146 flex-direction: column;
143 justify-content: space-between; 147 justify-content: space-between;
144 align-items: flex-start; 148 align-items: flex-start;
145 height: 188rpx; 149 height: 188rpx;
146 } 150 }
147 .orderName{ 151 .orderName{
148 font-size: 14px; 152 font-size: 14px;
149 color: #333333; 153 color: #333333;
150 } 154 }
151 .orderDescrib{ 155 .orderDescrib{
152 font-size: 12px; 156 font-size: 12px;
153 color: #999999; 157 color: #999999;
154 } 158 }
155 .infoText-bottom{ 159 .infoText-bottom{
156 display: flex; 160 display: flex;
157 flex-direction: row; 161 flex-direction: row;
158 justify-content: space-between; 162 justify-content: space-between;
159 align-items: center; 163 align-items: center;
160 width: 100%; 164 width: 100%;
161 .markPrice{ 165 .markPrice{
162 font-size: 14px; 166 font-size: 14px;
163 color: #FF6B4A; 167 color: #FF6B4A;
164 } 168 }
165 .buy-num{ 169 .buy-num{
166 font-size: 12px; 170 font-size: 12px;
167 color: #999999; 171 color: #999999;
168 } 172 }
169 } 173 }
170 } 174 }
171 .payPrice{ 175 .payPrice{
172 text-align: right; 176 text-align: right;
173 margin: 20rpx 0; 177 margin: 20rpx 0;
174 font-size: 14px; 178 font-size: 14px;
175 color: #333333; 179 color: #333333;
176 .priceNum{ 180 .priceNum{
177 font-size: 14px; 181 font-size: 14px;
178 color: #FF6B4A; 182 color: #FF6B4A;
179 } 183 }
180 } 184 }
181 .btns{ 185 .btns{
182 display: flex; 186 display: flex;
183 justify-content: flex-end; 187 justify-content: flex-end;
184 align-items: center; 188 align-items: center;
185 .btn-type1{ 189 .btn-type1{
186 height: 48rpx; 190 height: 48rpx;
187 width: 156rpx; 191 width: 156rpx;
188 border: 1px solid #FF6B4A; 192 border: 1px solid #FF6B4A;
189 border-radius: 12px; 193 border-radius: 12px;
190 border-radius: 12px; 194 border-radius: 12px;
191 text-align: center; 195 text-align: center;
192 line-height: 48rpx; 196 line-height: 48rpx;
193 font-size: 12px; 197 font-size: 12px;
194 color: #FF6B4A; 198 color: #FF6B4A;
195 } 199 }
196 .btn-type2{ 200 .btn-type2{
197 height: 48rpx; 201 height: 48rpx;
198 width: 140rpx; 202 width: 140rpx;
199 background: #FF6B4A; 203 background: #FF6B4A;
200 border-radius: 12px; 204 border-radius: 12px;
201 border-radius: 12px; 205 border-radius: 12px;
202 text-align: center; 206 text-align: center;
203 line-height: 48rpx; 207 line-height: 48rpx;
204 font-size: 12px; 208 font-size: 12px;
205 color: #FFFFFF; 209 color: #FFFFFF;
206 margin-left: 20rpx; 210 margin-left: 20rpx;
207 } 211 }
208 } 212 }
209 } 213 }
210 </style> 214 </style>
211 215
src/pages/myOrder/myOrder.vue
Diff comments   View file @72d769f
1 <template> 1 <template>
2 <view class="content"> 2 <view class="content">
3 <view class="header"> 3 <view class="header">
4 <!-- 搜索--> 4 <!-- 搜索-->
5 <view class="searchBar"> 5 <view class="searchBar">
6 <icon class="searchIcon" type="search" size="14"></icon> 6 <icon class="searchIcon" type="search" size="14"></icon>
7 <input class="searchIpt" placeholder="搜索订单关键字..." confirm-type="search"/> 7 <input class="searchIpt" placeholder="搜索订单关键字..." confirm-type="search"/>
8 </view> 8 </view>
9 <view class="screenBar"> 9 <view class="screenBar">
10 <view v-for="item in screenItems" :key="item.current" @click="onClickItem(item.current)" > 10 <view v-for="item in screenItems" :key="item.current" @click="onClickItem(item.current)" >
11 <view class="screenItem" v-bind:class="{ active: current === item.current }">{{ item.text }}</view> 11 <view class="screenItem" v-bind:class="{ active: current === item.current }">{{ item.text }}</view>
12 </view> 12 </view>
13 </view> 13 </view>
14 </view> 14 </view>
15 <view class="orderList" > 15 <view class="orderList" >
16 <view v-for="(order) in orderList" :key="order.orderId"> 16 <view
17 v-for="(order) in orderList"
18 :key="order.orderId"
19 >
17 <OrderCard :order = "order" :current="current"></OrderCard> 20 <OrderCard :order = "order" :current="current"></OrderCard>
18 </view> 21 </view>
19 </view> 22 </view>
20 <view class="footer">已显示全部</view> 23 <view class="footer">已显示全部</view>
21 </view> 24 </view>
22 </template> 25 </template>
23 <script> 26 <script>
24 import OrderCard from './components/OrderCard.vue' 27 import OrderCard from './components/OrderCard.vue';
28 import store from '@/store';
29
25 export default { 30 export default {
26 components:{ 31 components:{
27 'OrderCard':OrderCard 32 'OrderCard': OrderCard
28 }, 33 },
29 data() { 34 data() {
30 return { 35 return {
31 screenItems: [ 36 screenItems: [
32 {current:0,text:'全部'}, 37 {current:0,text:'全部'},
33 {current:1,text:'待付款'}, 38 {current:1,text:'待付款'},
34 {current:2,text:'待发货'}, 39 {current:2,text:'待发货'},
35 {current:3,text:'待收货'}, 40 {current:3,text:'待收货'},
36 {current:4,text:'退款售后'}, 41 {current:4,text:'退款售后'},
37 ], 42 ],
38 current: 0, 43 current: 0,
39 //订单数据 44 //订单数据
40 orderList:[ 45 // orderList:[
41 { orderId: 0, img: '/static/img/goods/p1.jpg', name: '商品名称',originCost:'￥198',price: '￥168', orderType:1 ,buyNum:1}, 46 // { orderId: 0, img: '/static/img/goods/p1.jpg', name: '商品名称',originCost:'￥198',price: '￥168', orderType:1 ,buyNum:1},
42 { orderId: 2, img: '/static/img/goods/p3.jpg', name: '商品名称',originCost:'￥198',price: '￥168', orderType:1 ,buyNum:1}, 47 // { orderId: 2, img: '/static/img/goods/p3.jpg', name: '商品名称',originCost:'￥198',price: '￥168', orderType:1 ,buyNum:1},
43 { orderId: 3, img: '/static/img/goods/p4.jpg', name: '商品名称',originCost:'￥198',price: '￥168', orderType:2 ,buyNum:1}, 48 // { orderId: 3, img: '/static/img/goods/p4.jpg', name: '商品名称',originCost:'￥198',price: '￥168', orderType:2 ,buyNum:1},
44 { orderId: 4, img: '/static/img/goods/p5.jpg', name: '商品名称',originCost:'￥198',price: '￥168', orderType:3 ,buyNum:1}, 49 // { orderId: 4, img: '/static/img/goods/p5.jpg', name: '商品名称',originCost:'￥198',price: '￥168', orderType:3 ,buyNum:1},
45 { orderId: 5, img: '/static/img/goods/p6.jpg', name: '商品名称',originCost:'￥198',price: '￥168', orderType:3 ,buyNum:1}, 50 // { orderId: 5, img: '/static/img/goods/p6.jpg', name: '商品名称',originCost:'￥198',price: '￥168', orderType:3 ,buyNum:1},
46 { orderId: 6, img: '/static/img/goods/p7.jpg', name: '商品名称',originCost:'￥198',price: '￥168', orderType:4 ,buyNum:1}, 51 // { orderId: 6, img: '/static/img/goods/p7.jpg', name: '商品名称',originCost:'￥198',price: '￥168', orderType:4 ,buyNum:1},
47 { orderId: 7, img: '/static/img/goods/p8.jpg', name: '商品名称',originCost:'￥198',price: '￥168', orderType:4 ,buyNum:1}, 52 // { orderId: 7, img: '/static/img/goods/p8.jpg', name: '商品名称',originCost:'￥198',price: '￥168', orderType:4 ,buyNum:1},
48 { orderId: 8, img: '/static/img/goods/p9.jpg', name: '商品名称',originCost:'￥198',price: '￥168', orderType:5 ,buyNum:1}, 53 // { orderId: 8, img: '/static/img/goods/p9.jpg', name: '商品名称',originCost:'￥198',price: '￥168', orderType:5 ,buyNum:1},
49 { orderId: 9, img: '/static/img/goods/p10.jpg', name: '商品名称',originCost:'￥198',price: '￥168', orderType:5 ,buyNum:1} 54 // { orderId: 9, img: '/static/img/goods/p10.jpg', name: '商品名称',originCost:'￥198',price: '￥168', orderType:5 ,buyNum:1}
50 ], 55 // ],
51
52 }; 56 };
53 }, 57 },
58 onLoad: function() {
59 store.dispatch('myOrder/getList', {
60 uid: "1",
61 way: "0",
62 });
63 },
64 computed: {
65 orderList() {
66 console.log('orderList', this.$store.state.myOrder.orderlist);
67 return this.$store.state.myOrder.orderlist;
68 }
69 },
54 methods:{ 70 methods:{
55 onClickItem(e) { 71 onClickItem(e) {
56 if (this.current !== e) { 72 if (this.current !== e) {
57 this.current = e; 73 this.current = e;
58 } 74 }
59 } 75 }
60 } 76 }
61 } 77 }
62 </script> 78 </script>
63 79
64 <style lang="scss"> 80 <style lang="scss">
65 .content { 81 .content {
66 display: flex; 82 display: flex;
67 flex-direction: column; 83 flex-direction: column;
68 align-items: center; 84 align-items: center;
69 background-color: #F7F6F6; 85 background-color: #F7F6F6;
70 min-height: 100vh; 86 min-height: 100vh;
71 .header{ 87 .header{
72 background-color: #ffffff; 88 background-color: #ffffff;
73 width: 100%; 89 width: 100%;
74 height: 232rpx; 90 height: 232rpx;
75 padding: 40rpx 40rpx 36rpx 40rpx; 91 padding: 40rpx 40rpx 36rpx 40rpx;
76 box-sizing: border-box; 92 box-sizing: border-box;
77 position: fixed; 93 position: fixed;
78 top: 0; 94 top: 0;
79 left: 0; 95 left: 0;
80 .searchBar { 96 .searchBar {
81 width: 670rpx; 97 width: 670rpx;
82 display: flex; 98 display: flex;
83 justify-content: center; 99 justify-content: center;
84 align-items: center; 100 align-items: center;
85 box-sizing: border-box; 101 box-sizing: border-box;
86 padding: 0rpx 16rpx; 102 padding: 0rpx 16rpx;
87 border: 1px solid #FF6B4A; 103 border: 1px solid #FF6B4A;
88 border-radius: 8rpx; 104 border-radius: 8rpx;
89 background-color: #ffffff; 105 background-color: #ffffff;
90 } 106 }
91 107
92 .screenBar{ 108 .screenBar{
93 width: 670rpx; 109 width: 670rpx;
94 height: 110rpx; 110 height: 110rpx;
95 display: flex; 111 display: flex;
96 flex-direction: row; 112 flex-direction: row;
97 justify-content: space-between; 113 justify-content: space-between;
98 align-items: center; 114 align-items: center;
99 color: #333333; 115 color: #333333;
100 font-size: 32rpx; 116 font-size: 32rpx;
101 } 117 }
102 .screenItem{ 118 .screenItem{
103 height: 50rpx; 119 height: 50rpx;
104 font-size: 32rpx; 120 font-size: 32rpx;
105 color: #333333; 121 color: #333333;
106 display: flex; 122 display: flex;
107 justify-content: center; 123 justify-content: center;
108 align-items: center; 124 align-items: center;
109 transition:all 0.2s; 125 transition:all 0.2s;
110 } 126 }
111 .active{ 127 .active{
112 // font-size: 34rpx; 128 // font-size: 34rpx;
113 color: #EC5D3B; 129 color: #EC5D3B;
114 } 130 }
115 .searchIpt { 131 .searchIpt {
116 height: 68rpx; 132 height: 68rpx;
117 width: 670rpx; 133 width: 670rpx;
118 padding: 16rpx; 134 padding: 16rpx;
119 font-size: 28rpx; 135 font-size: 28rpx;
120 box-sizing: border-box; 136 box-sizing: border-box;
121 } 137 }
122 } 138 }
123 .orderList{ 139 .orderList{
124 margin-top: 232rpx; 140 margin-top: 232rpx;
125 } 141 }
126 .footer{ 142 .footer{
127 font-size: 14px; 143 font-size: 14px;
128 color: #B8B8B8; 144 color: #B8B8B8;
129 margin: 40rpx 0; 145 margin: 40rpx 0;
130 } 146 }
131 } 147 }
132 </style> 148 </style>
src/store/modules/myOrder.js
Diff comments   View file @72d769f
1 import urlAlias from '../url';
2 import request from '../request';
3
4 const {
5 orderList
6 } = urlAlias;
7
8 const data = {
9 data: [
10 {
11 finished_time: null,
12 is_refound: "0",
13 mch_id: "1436019502",
14 money_of_dcw: "0",
15 money_of_partner: "0",
16 money_of_shop: "0",
17 orderJudge: false,
18 order_info: {
19 address:{
20 cityName: "镇江市",
21 countyName: "丹阳市",
22 detailInfo: "延陵镇柳茹村卫生室附近秀野堂农业发展有限公司",
23 errMsg: "chooseAddress:ok",
24 nationalCode: "321181",
25 postalCode: "212300",
26 provinceName: "江苏省",
27 telNumber: "15896379277",
28 userName: "点餐汪客服",
29 },
30 cartinfo:['11', '12'],
31 keyname: "1_1587129366",
32 lefttime: 179995,
33 list:[
34 {
35 cart_id: "11",
36 imgUrl: "https://glass.xiuyetang.com//upload_jk/4/4_0_3FDA03.jpg",
37 img_index_url: null,
38 memo: "志平防蓝光-防辐射电脑网课眼镜，TR90弹性漆，近视镜，青春潮流，01-8701",
39 mp_id: "1",
40 nowPrice: 100,
41 num: "2",
42 oldPrice: "0",
43 p_discount: "1",
44 p_name: "01-8701志平防蓝光-防辐射电脑网课眼镜，TR90弹性漆，近视镜，青春潮流",
45 p_root_index: "1",
46 p_sale_price: "0",
47 peopleName: "me",
48 pics: '',
49 pid: "4",
50 sk_id: "38",
51 },
52 ],
53 orderDesc: "总共包括有：01-8701志平防蓝光-防辐射电脑网课眼镜，TR90弹性漆，近视镜，青春潮流在内的1件商品",
54 total_fee: 100
55 },
56 partner_uid: "0",
57 pay_cate: "2020",
58 pay_id: "3",
59 pay_time: "2020-04-17 21:16:12",
60 pay_wood_desc: "在【非常戴镜】的微信付款凭证",
61 pay_wood_id: "fcdj-1-1_1587129366",
62 prepay_id: "wx172116124528226bf1a8adad1662456500",
63 re_check_staus: "0",
64 shopid: "0",
65 split_userid: "0",
66 status: "1",
67 total_fee: "100",
68 uid: "1",
69 }
70 ],
71 msg: "订单列表",
72 status: 0,
73 }
74
1 const state = { 75 const state = {
2 orderList: [], 76 orderList: [],
3 }; 77 };
4 78
5 const mutations = { 79 const mutations = {
6 getOrder: (state, data) => { 80 INIT: (state, data) => {
7 state.orderList = data; 81 state.orderList = data;
8 }, 82 },
9 }; 83 };
10 84
11 const actions = { 85 const actions = {
12 fetch({ commit }, param) { 86 getList({ commit }, param) {
13 uni 87 request({
14 .request({ 88 url: orderList,
15 url: "", 89 data: param,
16 method: "post", 90 success: (res) => {
17 data: {}, 91 const resData = {
18 header: { 92 ...res,
19 "Content-Type": "application/x-www-form-urlencoded", 93 data,
20 }, 94 }
21 timeout: 3000, 95 console.log('data.data', resData.data.data);
22 withCredentials: false, 96 commit("INIT", resData.data.data);
23 success: (res) => { 97 },
24 commit('getOrder', res.data.data) 98 })
25 }, 99 }
26 fail: (res) => {
27 console.log("fail status === > ", res);
28 },
29 complete: (res) => {
30 console.log("complete status === > ", res);
31 }
32 })
33 }
src/store/request.js
Diff comments   View file @72d769f
1 const DOMAIN = 'https://api.glass.xiuyetang.com/'; 1 const DOMAIN = 'https://api.glass.xiuyetang.com';
2 2
3 export default async function request({ 3 export default async function request({
4 url, 4 url,
5 method = "post",
6 data = {},
7 header = {
8 "Content-Type": "application/x-www-form-urlencoded",
9 },
10 timeout = 3000,
11 withCredentials = false, // 跨域请求时是否携带凭证（cookies）
12 // sslVerify: true, // 验证 ssl 证书
5 success, 13 success,
6 fail, 14 fail = (res) => {
7 complete, 15 console.log("fail status === > ", res);
16 },
17 complete = (res) => {
18 console.log("complete status === > ", res);
19 },
8 }) { 20 }) {
9 console.log("DOMAIN", DOMAIN, url); 21 console.log("DOMAIN", DOMAIN, url);
10 uni 22 uni
11 .request({ 23 .request({
12 url: DOMAIN + url, 24 url: DOMAIN + url,
13 method: "post", 25 method,
14 data: {}, 26 data,
15 header: { 27 header,
16 "Content-Type": "application/x-www-form-urlencoded", 28 timeout,
17 }, 29 withCredentials,
18 timeout: 3000,
19 withCredentials: false,
20 success, 30 success,
21 fail, 31 fail,
22 complete, 32 complete,
1 const urlAlias = { 1 const urlAlias = {
2 // 获取首页商品列表 2 // 首页
3 shopList: 'app/prod/list', 3 shopList: '/app/prod/list', // 获取首页商品列表
4
5
6
7 // 我的订单
8 orderList: '/app/order/list', // 获取订单列表
4 } 9 }
5 10
6 export default urlAlias; 11 export default urlAlias;
7 12